05-jQuery动画
来源:互联网 发布:医疗器械软件研究文档 编辑:程序博客网 时间:2024/06/06 08:42
第五节:jQuery动画
操作DOM
a.什么是DOM:Document Object Model缩写,文档对象模型
b.理解页面的树形结构
c.什么是节点:是DOM结构中最小单元,包括元素、属性、文本、文档等
一、创建节点
1.创建元素
语法:document.createElement(name);
var div = document.createElement("div");document.body.appendChild(div);
$(html):根据传递的标记字符串,创建DOM对象
2.创建文本
var div = document.createElement("div");var txt = document.createTextNode("DOM");div.appendChild(txt);document.body.appendChild(div);
var $div = = $("<div>DOM</div>");$(body).append($div);
3.设置属性
语法:e.setAttrbute(name,value)
var div = document.createElement("div");var txt = document.createTextNode("DOM");div.appendChild(txt);document.body.appendChild(div);div.setAttribute("title","盒子");
var $div = = $("<div title='盒子'>DOM</div>");$(body).append($div);
二、插入内容
内部插入
向元素最后面插入节点: append():
向每个匹配的元素内部追加内容 appendTo()
:把所有匹配的元素追加到指定元素集合中,$("A").append("B")
等效 $("B").appendTo("A")
向元素最前面插入节点: prepend():
把每个匹配的元素内部前置内容 prependTo()
:把所有匹配的元素前置到另一个指定的元素集合中,$("A").prepend("B")
等效 $("B").prependTo("A")
外部插入
after()
:在每个匹配的元素之后插入内容 before(
):在每个匹配想元素之前插入内容 insertAfter(
):将所有匹配的元素插入到另一个指定的元素集合后面,$A.insert($B)
等效 $B.insertAfter($A)
; insertBefore()
:将所有匹配的元素插入到另一个指定的元素集合前面 $B.insertBefore($A
);
三、删除内容
移除 remove()
:从DOM中删除所有匹配元素
清空 empty()
:删除匹配的元素集合中所有子节点内容
四、克隆内容:创建指定节点副本
clone()
注意:若clone(true)则是包括克隆元素的属性,事件等
五、替换内容
replaceWith()
:将所有匹配的元素替换成指定的元素 replaceAll()
:用匹配的元素替换掉指定元素
注意:两者效果一致,只是语法不同
- 05-jQuery动画
- jQuery动画
- jquery动画
- jQuery动画
- jQuery动画
- jQuery动画
- jquery 动画
- JQuery动画
- jquery 动画
- jQuery动画
- jquery动画
- jquery动画
- jQuery-动画
- jquery动画
- jquery动画
- jQuery动画
- jQuery动画
- jQuery动画
- 计算机三级考试准备笔记
- nginx配合rtmp模块搭建流服务器
- 疯牛
- 【POJ1160】【IOI2000】邮局(区间dp)
- 使用github创建个人网站
- 05-jQuery动画
- jupyter import ... note
- 线性结构 1 两个有序链表序列的合并
- 解读 TiWorkerCoreInitialize
- Java容器----HashMap和HashSet的区别
- 【LeetCode】 70. Climbing Stairs
- BZOJ2713 [Violet 2]愚蠢的副官&BZOJ1183 [Croatian2008]Umnozak
- 让网络请求简单点——Volley框架(中)
- RNN上的BPTT的简单推导