jQuery的DOM操作(1)
jQuery的插入操作
(一)、$("html结构")函数
创建div节点如$("<div></div>")。
(二)、append()与appendTo()函数
1、append()向匹配的元素添加内容。如$('p').append("字符串")
2、appendTo()把所有匹配的元素添加到另一个、指定的元素集合中。$('字符串').appendTo($('p'))
(三)、prepend()和prependTo()函数
1、prepend()向匹配的元素前置添加内容。$('p').prepend("字符串")
2、prependTo()把所有匹配的元素前置到另一个、指定的元素集合中。$('字符串').prependTo($('p'))
(四)、after()和before()函数
1、after()把参数内的内容添加到匹配的元素后。$('p').after("字符串")
2、before()把参数内的内容添加到匹配的元素前。$('p').before("字符串")
(五)、insertAfter()和insertBefore()函数
1、insertAfter()把参数内的内容添加到匹配的元素后。$('字符串').insertAfter($('p'))
2、insertBefore()把参数内的内容添加到匹配的元素前。$('字符串').insertBefore($('p'))
after()和before()函数与insertAfter()和insertBefore()函数的区别
1、主要的区别是语法——内容和目标的位置。 对于before()选择表达式在函数前面,内容作为参数,而.insertBefore()刚好相反,内容在方法前面,它将被放在参数里元素的前面。
2、before、after与insertBefore。insertAfter的除了目标与位置的不同外,后面的不支持多参数处理。
jQuery的删除操作
(一)、empty()函数
移除指定节点的子节点,不移除本节点。如$('p').empty()。
(二)、remove()函数
remove会将元素自身移除,同时也会移除元素内部的一切,包括绑定的事件及与该元素相关的jQuery数据。
如$('p').remove()或$('p').remove('contains("1")')。
empty()和remove()方法区别
empty方法
empty()方法并不是删除节点,而是清空节点,它能清空元素中的所有后代节点。
empty不能删除自己本身这个节点。
remove方法
该节点与该节点所包含的所有后代节点将同时被删除。
提供传递一个筛选的表达式,删除指定合集中的元素。
(三)、detach()函数
从当前页面中移除该元素,但保留这个元素的内存模型对象。如$("p").detach()。