jQuery学习笔记2

2015年10月23日

删除节点

jquery提供了3种删除节点的方法,即remove( ),detach( )和empty( )。
1.remove( )方法
作用:从DOM中删除所有匹配的元素,传入的参数根据jquery表达式来筛选元素。
例如删除<ul>节点的第二个<li>元素节点,示例:

$("ul li:eq(1)").remove( );

当某个节点用remove( )删除后,该节点所包含的所有后代节点将同时被删除。这个方法的返回值是一个指向已被删除的节点的引用,因此可以在以后再使用这些元素。示例:

var $li = $("ul li:eq(1)").remove( );
$li.appendTo("ul");

remove( )方法也可以通过传递参数来选择性的删除元素,示例:

$("ul li").remove("li[title!=菠萝]");

2.detach()方法
detach()方法和remove()方法一样,也是从DOM中去掉匹配的元素。但是,detach()方法不会把匹配的元素从jquery对象中删除,因而将来可以再使用这些匹配的元素。与remove( )不同的是,所有绑定的时间、附加的数据等都会保留下来。

3.empty()方法
严格来讲,empty()并不是删除节点,而是清空节点,他能清空元素中所有后代节点

复制节点

复制节点使用clone( )方法来完成
复制节点后,被复制的新元素不具有任何行为。如果需要新元素也具有复制功能,可以

clone(true)

在clone()中传递了一个true参数,他的含义是复制元素的同时复制元素中绑定的事件。

替换节点

replaceWith( )和replaAll( )

replaceWith( )方法是将所有匹配的元素都替换成指定的HTML或DOM元素。
示例:

$("p").replaceWith("<strong>您好</strong>");

replaceAll( )方法的作用只是颠倒了replaceWith( ),示例:

("<strong>您好</strong>").replaceAll("p");

两者的效果都一样。

2015年10月26日 周一

包裹节点

如果要将某个节点用其他标记包裹起来,使用wrap( )。改方法对于需要在文档中插入额外的结构化标记非常有用。
示例:

$("strong").wrap("<b></b>"); //用<b>标签把<strong>元素包裹起来

得到的结果如下:

<b><strong>您好</strong></b>

包裹节点还有其他两个方法,即wrapAll( )

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1:jQuery节点创建与属性的处理 创建元素节点:可以有几种方式,后面会慢慢接触。常见的就是直接把这个节点的结构...
    码农小杨阅读 620评论 0 1
  • 第1章 简介 第2章 DOM节点的创建 2-1 DOM创建节点及节点属性 通过JavaScript可以很方便的获...
    mo默22阅读 832评论 0 8
  • DOM创建节点及节点属性 通过JavaScript可以很方便的获取DOM节点,从而进行一系列的DOM操作。但实际上...
    阿r阿r阅读 1,035评论 0 9
  • 或许每个人的心中都有一个英雄,或刚正不阿,一身正气,或勇敢无畏,见义勇为……然而要在现实生活中去发现或是实...
    剑飞雪阅读 401评论 0 0
  • 孩子就是父母的影子,不要责备孩子做的不对,我们作为父母必需反思自己,为什么孩子今天会变成这样?作为父母的我们是如何...
    真实让梦飞阅读 409评论 0 0