jQuery操作页面的元素
主要有添加,替换,删除,清空三种方式:
添加又分为,在之前添加,在之后添加,在元素外之前添加,在元素外之后添加。每个添加方式又有俩种方法(效果一模一样):
俩种方法区添加,在原内容之后:
p.appendTo("#div");
$("#div").append(p);
俩种方法区添加,在原内容之前:
p.prependTo("#div");
$("#div").prepend(p);
俩种方法区添加,在原内容外的前面添加:
p.insertBefore("#div");
$("#div").before(p);
俩种方法区添加,在原内容外的后面添加:
p.insertAfter("#div");
$("#div").after(p);
替换指定结点元素,也时俩种方式(下标是从1开始):
p.replaceAll("div p:nth-child(2)");
$("div p:nth-child(2)").replaceWith(p);
删除指定结点元素:
1.删除整个div:
$("div").remove();
2.删除指定元素,下标从1开始:
$("div p:nth-child(4)").remove();
清空内容 和删除也一样也时俩种方式(清空和删除的区别:清空只是将内容清空,框架还在,删除就是全部删除):
1.清空整个div:
$("div").empty();
2.清空指定元素:
$("div p:nth-child(2)").empty();
jQuery操作页面的元素的更多相关文章
- 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变
查看本章节 查看作业目录 需求说明: 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变 当用户单击"+" ...
- 使用 jQuery 操作页面元素的方法,实现浏览大图片的效果,在页面上插入一幅小图片,当鼠标悬停到小图片上时,在小图片的右侧出现与之相对应的大图片
查看本章节 查看作业目录 需求说明: 使用 jQuery 操作页面元素的方法,实现浏览大图片的效果,在页面上插入一幅小图片,当鼠标悬停到小图片上时,在小图片的右侧出现与之相对应的大图片 实现思路: 在 ...
- jQuery操作得到DOM元素
jQuery再DOM操作方面提供了一些函数及其用法,这里就对DOM元素的包装简单说明一下,怎样使用会了,对其它方法也能灵活的使用.以下是一个小样例及其效果图. 代码例如以下: <html xml ...
- jQuery 实战读书笔记之第五章:使用 jQuery 操作页面
html 如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> &l ...
- jQuery操作DOM基础 - 元素属性的查看与设置
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Jquery 操作页面中iframe自动跟随窗口大小变化,而页面不出现滚动条,只在iframe内部出滚动条
很多时候大家需要iframe自适应所加载的页面高度而不要iframe滚动条,但是这次我需要的是页面不需要滚动条而iframe要滚动条,且iframe自动跟随窗口大小变化.自适应页面大小.下面是代码,下 ...
- jquery操作ajax返回的页面元素
这两天工作不忙,正好从朋友那里拿到一个某个应用的开发文档,相关数据放在了mongodb里,自己电脑可以本地开启服务器然后通过给的借口来获取数据.由于这是一个比较大比较全的一个完整项目,也没有那么多经历 ...
- jquery操作iframe的方法:父页面和子页面相互操作的方法
今天在弄jquery操作iframe中元素:先由iframe中的子页面b.html给外面的父页面a.html页面传值,再将a.html页面计算机的值放到b.html页面上,这里就用到子页面和父页面相互 ...
- webAPI(DOM) 2.1 获取页面元素 | 事件1 | 属性操作 | 节点 | 创建元素 | 事件2
js分三个部分: ECMAScript标准:js的基本语法 DOM:Ducument Object Model--->文档对象模型--->操作页面的元素 BOM:Browser Objec ...
随机推荐
- python使用openpyxl操作excel总结
安装openpyxl pip install openpyxl 简单示例 from openpyxl import Workbook #创建一个工作薄对象,也就是创建一个excel文档 wb = Wo ...
- java VS c#,异同点
因工作安排,后期需要维护一个java项目.所以稍微熟悉下java,开此篇记录下java与c#的区别点,方便增强自己学习效果.肯定是不全的,可能是有错的,欢迎批评指正. 一.关键字 描述 C# Java ...
- windows中修改IP映射的位置
windows中修改IP映射的位置 置顶 2018年08月05日 14:42:44 wangxiaolong0 阅读数:1473 在安装linux之后,发现windows不能通过映射来访问linu ...
- TCP--文件上传
客户端 public class Test2_UpdateClient { public static void main(String[] args) throws UnknownHostExcep ...
- 微擎JS资源请求 403
微擎JS资源请求 403 1.确认JS是否指定 type ==> text/javascript 2.确认src的路径是否正确,{MODULE_URL}项目的根目录带反斜杠 3.实例:(PS:t ...
- beta week 1/2 Scrum立会报告+燃尽图 02
此作业要求参见https://edu.cnblogs.com/campus/nenu/2019fall/homework/9912 一.小组情况 队名:扛把子 组长:孙晓宇 组员:宋晓丽 梁梦瑶 韩昊 ...
- vue 父子组件传值,兄弟组件传值
父子组件中的传值 父向子 v-bind props <!-- 组件使用v-bind传值 --> <router :msg="msg"></rou ...
- DDD实战与进阶 - 值对象
目录 DDD实战与进阶 - 值对象 概述 何为值对象 怎么运用值对象 来看一个例子 值对象的持久化 总结 DDD实战与进阶 - 值对象 概述 作为领域驱动设计战术模式中最为核心的一个部分-值对象.一直 ...
- IDEA必备插件系列 - Key Promoter X(快捷键使用提示)
Key Promoter X 是用于基于 IntelliJ 产品(如 IDEA,Android Studio 或 CLion)的插件,它有助于在工作时从鼠标操作中 学习基本的键盘快捷键. 当您在 ID ...
- 删除节点(removeChild())
remoceChild():方法将从一个给定元素里删除一个子节点: reference = element.removeChild(node); 这个方法的返回值是一个指向已经被删除的子节点的引用指针 ...