1. 云栖社区>
  2. 技术文集>
  3. 列表>
  4. 正文

jquery 替换

作者:用户 来源:互联网 时间:2016-08-03 19:21:33

jquery对象方法this节点替换节点dommanipreplaceWithreplaceWith()replaceChild

jquery 替换 - 摘要: 本文讲的是jquery 替换, replaceWith() 用提供的内容替换集合中所有匹配的元素并且返回被删除元素的集合。 .replaceWith()可以从DOM中移除内容,然后在这个

replaceWith()

用提供的内容替换集合中所有匹配的元素并且返回被删除元素的集合。

.replaceWith()可以从DOM中移除内容,然后在这个地方插入新的内容。

通过调用replaceChild处理即可,但是这里需要注意的问题,就是事件的处理,因为节点的变更所以涉及到要移除这个节点的数据cleanData方法。

replaceWith: function() {
    var arg = arguments[0];
    this.domManip(arguments, function(elem) {
        arg = this.parentNode;
        jQuery.cleanData(getAll(this));
        if (arg) {
            arg.replaceChild(elem, this);
        }
    });
    return arg && (arg.length  arg.nodeType) ? this : this.remove();
}

.replaceWith()方法,和大部分其他jQuery方法一样,返回jQuery对象,所以可以和其他方法链接使用,但是需要注意的是:对于该方法而言,该对象指向已经从 DOM 中被移除的对象,而不是指向替换用的对象。

删除目标节点

jQuery( this ).remove();

然后再插入一个新节点

parent.insertBefore( elem, next );

将匹配元素集合从DOM中删除要涉及到empty,remove,detach方法。



以上是云栖社区小编为您精心准备的的内容,在云栖社区的博客、问答、公众号、人物、课程等栏目也有 的相关内容,欢迎继续使用右上角搜索按钮进行搜索jquery , 对象 , 方法 , this , 节点 , 替换节点 , dommanip , replaceWith , replaceWith() replaceChild jquery替换字符串、jquery替换html内容、jquery 替换元素、jquery、jquery 全部替换,以便于您获取更多的相关知识。

jquery 修改和替换input中值的问题

问题描述 jquery 修改和替换input中值的问题 左边的input中用"_"短下划线分割了4组元素,我现在需要通过右边的下拉菜单选择数字(1-10),选择后替换input中第三个短下划线中的内容,请问...

JQuery替换DOM节点的方法_jquery

本文实例讲述了JQuery替换DOM节点的方法。分享给大家供大家参考。具体分析如下: 如果要替换某个节点,jQuery提供了相应的方法,即replaceWith()和replaceAll()。 replaceWith()方法的作用是将所有匹配的元素都替换成指定的HTML或者DOM元...

jquery(4-4) clone() 复制和 replaceWidth() replaceAll() 替换元素

1.clone() a.clone() 方法生成被选元素的副本,包含子节点、文本和属性。查看实例 b.如何使用 clone() 方法复制一个元素,包含事件处理程序。查看实例 2.replaceWidth() replaceWith() 方法把被选元素替换为新的内容。查看实例 3.replaceAll() r...

20个有用的 PHP + jQuery 组件和教程

Web应用程序做了在改进用户的巨大的飞跃和区域体验由于很多最近被开发的Ajax技术。 当您结合PHP一些整洁的功能礼貌以jQuery的聪明时您能导致相当一些整洁的作用。 帮助您采取它山谷,我们希望分享帮助的您的站点有些方法期...

jQuery实现字符串全部替换的方法

本文实例讲述了jQuery实现字符串全部替换的方法。分享给大家供大家参考,具体如下: 与C# String类型的Replace方法不同,jQuery的Replace仅能替换第一个匹配的内容。 例如: var str = "abc";var Newstr = str.Replace("", "");alert(Newstr); //内容为...

前三篇
后三篇