jQuery中对节点进行操作的相关介绍

2019-12-24,,,

动态创建Dom节点


jQuery中使用$(html字符串)来动态创建Dom节点,并且返回一个jQuery对象,可以调用append等方法将创建的节点添加到Dom中。


例如:


        var link = $("<a href='http://www.baidu.com'>百度</a>");


        $("div:first").append(link);


添加节点元素的方法:


Append方法用来在元素的末尾追加元素(最后一个子节点)


Prepend在元素的开始添加元素(第一个子节点)


After:在元素之后添加元素(添加兄弟节点)


Before:在元素之前添加元素(添加兄弟节点)


子元素.appendTo(父元素):在元素的末尾追加一个子元素


子元素.prependTo(父元素):在元素的开始追加一个子元素


A.insertBefore(B)    将A插入到B的前面,等同于B.before(A);


X.insertAfter(B)   将X插入到Y的后面,等同于Y.after(X);
 


删除节点:


Empty():清空该元素下的所有子节点


        等同于:while(ele.firstChild){ele.removeChild(ele.firstChild);}


Remove(selectot);自杀;删除当前元素,返回值为被删除的元素,可以讲节点删除之后放到其他节点下面,有一个移动的效果,例如:


       var lis = $("#ulSite li").remove();


       $("#ulSite2").append(lis);


     
Clone()克隆节点,支复制节点,不复制节点


Clone(true):克隆节点带事件



节点的替换:


$("br").replaceWith("<hr/>");


$("br").replaceAll("<hr/>");
 


包裹节点


Wrap()方法用来将所有的元素逐个用指定的标签包裹


$("b").wrap("<font color='red'></font>");将所有粗体字红色显示


wrapInner();在内部围绕

您可能感兴趣的文章:

  • jQuery:节点(插入,复制,替换,删除)操作
  • jQuery移动和复制dom节点实用DOM操作案例
  • js和jquery对dom节点的操作(创建/追加)

《jQuery中对节点进行操作的相关介绍.doc》

下载本文的Word格式文档,以方便收藏与打印。