jQuery中的文档处理

Posted 2020-10-14 喝了雪碧我透心凉

一：内部插入

1：append(content)：向每个匹配的元素内部追加内容。$("p").append("<b>Hello</b>");

2：appendTo(content)：把所有匹配的元素追加到另一个指定的元素元素集合中。$("p").appendTo("div");

3：prepend(content)：向每个匹配的元素内部前置内容。$("p").prepend("<b>Hello</b>");

4：prependTo(content)：把所有匹配的元素前置到另一个、指定的元素元素集合中。$("p").prependTo("#foo");

二：外部插入

1：after(content)：在每个匹配的元素之后插入内容。$("p").after("<b>Hello</b>");

2：before(content):在每个匹配的元素之前插入内容。$("p").before("<b>Hello</b>");

3:insertAfter(content):把所有匹配的元素插入到另一个、指定的元素元素集合的后面。$("p").insertAfter("#foo");

4:insertBefore(content):把所有匹配的元素插入到另一个、指定的元素元素集合的前面。$("p").insertBefore("#foo");

三：包裹

1：wrap(html) 把所有匹配的元素用其他元素的结构化标记包裹起来。$("p").wrap("<div class=‘wrap‘></div>");

2：wrap(elem)：$("p").wrap(document.getElementById(‘content‘));

3：unwrap()这个方法将移出元素的父元素。 $("p").unwrap()

4：wrapAll(html)将所有匹配的元素用单个元素包裹起来  $("p").wrapAll("<div></div>");

5：wrapAll(elem)将所有匹配的元素用单个元素包裹起来$("p").wrapAll(document.createElement("div"));

6：wrapInner(html)将每一个匹配的元素的子内容(包括文本节点)用一个HTML结构包裹起来$("p").wrapInner("<b></b>");

7：wrapInner(elem)将每一个匹配的元素的子内容(包括文本节点)用DOM元素包裹起来$("p").wrapInner(document.createElement("b"));

四：替换

1：replaceWith(content)将所有匹配的元素替换成指定的HTML或DOM元素。$("p").replaceWith("<b>Paragraph. </b>");

2：replaceAll(selector)用匹配的元素替换掉所有 selector匹配到的元素。$("<b>Paragraph. </b>").replaceAll("p");

五：删除

1：empty()删除匹配的元素集合中所有的子节点。$("p").empty();

2：remove([expr])从DOM中删除所有匹配的元素。$("p").remove();

3：detach([expr])从DOM中删除所有匹配的元素。$("p").detach();

六：复制

1：clone()克隆匹配的DOM元素并且选中这些克隆的副本。$("b").clone().prependTo("p");

2：clone(true)元素以及其所有的事件处理并且选中这些克隆的副本。设置为true以便复制元素的所有事件处理