jQuery DOM节点操作_document.createelement('li')-优快云博客

本文链接：https://blog.youkuaiyun.com/lxf1276650695/article/details/112919548

这篇博客主要探讨了如何使用jQuery进行DOM节点的操作，包括利用document.createElement创建节点，jQuery选择器选取元素，以及各种DOM操作方法如append、prepend等，详细解释了jQuery简化JavaScript中DOM操作的流程和优势。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

创建节点
document.createElement(“li”);//js创建li节点var $l i =$ ("

");//jQuery创建li节点
节点元素插入
内部插入（父子节点关系）
js对象.appendChild：在内部添加节点
var o=document.createElement(“li”);//创建节点选中的js对象.appendChild(创建的节点);//js在内部插入节点
在内部最后一个元素后插入节点
selector.append(节点对象)：在selector元素内部的最后插入"节点对象"
function append(){ var $l i =$ (“
6
”); $(" u l ") . a p p e n d ($ li);}
节点对象.appendTo(selector)：将"节点对象"插入到selector内部的最后
function append2(){ var $l i =$ (“
6
”); $l i . a p p e n d T o ($ (“ul”));}
在内部第一个元素前插入节点
selector.prepend(节点对象)：在selector的内部的第一个元素之前插入"节点对象"
function prepend1(){ var $l i =$ (“
0
”); $(" u l ") . p r e p e n d ($ li);}
节点对象.prependTo(selector)：将"节点对象"插入到selector1内部的第一个
function prepend2(){ var $li = $(“
0
”); $l i . p r e p e n d T o ($ (“ul”));}
外部插入（同辈或相邻节点）
selector.after(节点对象)：在selector1后插入"节点对象"
function after(){ var $div = $(“
ul后的div
”); $(" u l ") . a f t e r ($ div);}
节点对象.insertAfter(selector)：将"节点对象"插入到selector1后面
function after(){var $div = $(" < d i v > u l 后的 d i v < / d i v > ");$ div.insertAfter($(“ul”));}
节点的替换
selector1.replaceWith(selector2)：将所有匹配的元素替换成selector元素
function replace(){ var $div = $(“
我要去替换p
”); $(" p ") . r e p l a c e W i t h ($ div);}
selector2.replaceAll(selector)：用匹配的元素（selector2）替换掉所有selector匹配到的元素
function replaceall(){ var $div = $(“
我要去替换p
”); $d i v . r e p l a c e A l l ($ (“p”));}