Jquery操作DOM节点

1、 向DOM节点中追加元素:

append:向元素内部追加内容:

例如:<p>我想说:</p> $(“p”).append(“<b>你好</b>”);

结果:<p>我想说: <b>你好</b></p>

appendTo:将匹配的元素追加到指定的元素中

例如:<p>我想说:</p> $(“<b>你好</b>”).appendTo(“p”);

结果:<p>我想说: <b>你好</b></p>

prepend:向每个匹配元素内部前置元素

例如:<p>我想说:</p> $(“p”).prepend (“<b>你好</b>”);

结果: <p> <b>你好</b>我想说:</p>

prependTo:将所有匹配的元素前置到指定的元素中

例如:<p>我想说:</p> $(“<b>你好</b>”).prependTo(“p”);

结果: <p> <b>你好</b>我想说:</p>

after:在每个匹配的元素之后插入内容

例如:<p>我想说:</p> $(“p”).after(“<b>你好</b>”);

结果:<p>我想说: </p><b>你好</b>

insertAfter:将所有匹配的元素插入到指定元素的后面

例如:<p>我想说:</p> $(“<b>你好</b>”).insertAfter(“p”);

结果:<p>我想说: </p><b>你好</b>

before:在每个元素之前插入内容

例如:<p>我想说:</p> $(“p”).before(“<b>你好</b>”);

结果: <b>你好</b><p>我想说:</p>

insertBefore: 将所有匹配的元素插入到指定元素的前面

例如:<p>我想说:</p> $(“<b>你好</b>”).insertBefore(“p”);

结果: <b>你好</b><p>我想说:</p>

2、 节点移除

a:在对象后面加入remove()方法,移除的内容虽然在网页上表现不存在了,但是在内存中还是存在的,remove后面还可以加入参数,进行选择$("ul li").remove("li[title != 2]");

b:在对象后面加入empty()方法,表示清空元素中的内容,元素位置还是存在

3、节点的复制,调用其clone()方法,里面可以包含true或者false参数,true表示克隆后的元素与原来的元素具有相同的属性和方法

3、属性操作:

attr():获取与设置属性

removeAttr():移除元素属性

3、 操作样式,可以使用attr,也可以使用addclass、removeclass

其中attr可以为相应的class赋值,但是它是从属性方面来考虑的

attr与addclass的区别:

你可能感兴趣的:(jquery)