【JQuery】replaceWith()和replaceAll()替换内容

最新推荐文章于 2024-03-25 17:04:01 发布
最新推荐文章于 2024-03-25 17:04:01 发布
阅读量2.2k 收藏 1
点赞数
分类专栏： jQuery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/happyhaojie/article/details/51042914
版权

replaceWith()和replaceAll()方法都可以用于替换元素或元素中的内容。

但它们调用时，内容和被替换元素所在的位置不同，分别为如下所示：

$(selector).replaceWith(content)和$(content).replaceAll(selector)

参数selector为被替换的元素，content为替换的内容。


<body>
        <h3>使用replaceAll()方法替换元素内容</h3>
        <span class="green" title="hi">我是屌丝</span>
        <span class="green1" title="hi">我是屌丝</span>
        <script type="text/javascript">
            var $html = "<span class='red' title='hi'>我是土豪</span>";
            $($html).replaceAll(".green");
            $(".green1").replaceWith($html);
        </script>
    </body>

结果是：






badlyForPapers
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
AST基础知识|babel库中path常用方法总结
Python3 爬虫实战 1:应对特殊字体,爬取猫眼电影实时排行榜
10-12 2878
path.toString这个非常有用，经常用于定于插件遍历的path，以便分析问题。path.实参一般是 node 类型，即将当前遍历的path替换为 实参里的 新节点。注意，它不能用于 Array 的替换，即实参不能是Array类型。path.实参一般是 Array 类型，它只能用于 Array 的替换。即所有需要替换的节点在一个Array里面，常见的替换如 Block 类型节点里的 body.body。直接调用即可将当前遍历的所有符合条件的路径全部删除，所以使用的时候需要注意。
jQuery中replaceAll()方法用法实例
12-11
replaceAll()方法的作用和replaceWith()方法是完全一样的。 语法结构: 代码如下:$(content).replaceAll(selector) 参数列表: 参数 描述 content 用于替换的内容。 selector 用于查找所要被替换的元素 ...
jQuery中的replaceWith和replaceAll方法
ANFO的博客
11-11 788
在jQuery中有两个方法可以执行对标签的替换操作，replaceWith()和replaceAll()方法： replaceWith() ：将所有匹配的元素替换成指定的HTML或DOM元素。 replaceAll(selector)：用匹配的元素替换掉所有 selector匹配到的元素。 在如下的代码中，首先使用标签选择器获取span，b，i标签，然后调用replaceWith()方法将...
eslint搭配prettier出现Replace `XXX` with `⏎··········XXX⏎·······`的问题解决方法
热门推荐
松烟入墨
10-28 2万+
出现原因 因为代码每行的字数过长，而prettier中建议的是80字符换行，跟VS code中的配置冲突导致，每次保存都会闪动一下。 解决办法 打开VS code的设置页面，搜索printWidth，将其全部修改为80，保存即可。 ...
AST学习三---构造节点
最新发布
Awesome_py的博客
03-25 290
将 var a = 3;通过AST替换成 var a = 1+2
AST之path常用属性和方法总结笔记
自成背后的博客
02-28 1179
AST path属性方法总结
JQuery替换DOM节点的方法
12-29
如果要替换某个节点，jQuery提供了相应的方法，即replaceWith()和replaceAll()。 replaceWith()方法的作用是将所有匹配的元素都替换成指定的HTML或者DOM元素。 本例 JQuery 代码： [removed] //<![CDATA[ $...
jQuery实现节点的追加、替换、删除、复制功能示例
10-19
主要介绍了jQuery实现节点的追加、替换、删除、复制功能,结合具体实例形式分析了jQuery针对DOM节点的操作技巧,涉及append()、prepend()、replaceAll()、replaceWith()empty()、remove()、clone()、clone()等方法的...
jQuery中clone()方法用法实例
10-24
主要介绍了jQuery中clone()方法用法,实例分析了clone()方法的功能、定义及克隆匹配的DOM元素的使用技巧,需要的朋友可以参考下
js replaceAll()方法讲解
weixin_39501680的博客
01-04 2170
js replaceAll()方法讲解 将所有 “Microsoft” 替换为 “Runoob”： var str="Visit Microsoft! Visit Microsoft!"; var n=str.replaceAll("Microsoft","Runoob"); Visit Runoob!Visit Runoob! 定义和用法 replaceAll() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串，该函数会替换所有匹配到的子字符串。 如果想了解更多正则
浅谈jQuery中replace()方法
10-24
主要介绍了jQuery中replace()方法用法,实例分析了replace()方法的功能、定义及匹配元素去替换指定内容的方法,需要的朋友可以参考下
jQuery标签替换函数replaceWith()的使用例子
10-25
主要介绍了jQuery标签替换函数replaceWith()的使用例子,使用replaceWith可以替换模板里的标签,还可以实现多语言网站,需要的朋友可以参考下
30. jQuery-使用replaceWith（）和replaceAll（）方法替换元素节点
LiGuogang
12-19 724
1. 效果图 2. html代码 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;title&gt;jQuery-使用replaceWith（）和replaceAll（）方法替换元素节点&lt;/title&gt; &lt;style type="text/css"&gt; body{fo
一文助你搞懂 AST
程序员成长指北
06-22 2107
好朋友在团队分享的文章作者：fecym原文地址：https://chengyuming.cn/views/webpack/AST.html什么是 AST抽象语法树（Abstract Sy...
jQuery中的replaceWith（） 和replaceAll（）方法
weixin_45104211的博客
11-11 365
一、总结（替换） replaceWith(content|fn) ：将所有匹配的元素替换成指定的HTML或DOM元素。 replaceAll(selector)：用匹配的元素替换掉所有 selector匹配到的元素 二、案例 一、代码如下 <!DOCTYPE html> <html> <head> <meta char...
jQuery的replaceWIth()与replaceAll()
qq_41083450的博客
11-11 244
replaceWith() replace()
深入学习jquery源码之replaceWith()和replaceAll()
悦分享
12-30 633
深入学习jquery源码之replaceWith()和replaceAll() replaceWith(content|fn) 概述 将所有匹配的元素替换成指定的HTML或DOM元素。 参数 content String, Element, jQuery, Function 用于将匹配元素替换掉的内容。如果这里传递一个函数进来的话，函数返回值必须是HTML字符串。 fn Functi...
jquery用outerHTML替换html节点
06-06
可以使用`outerHTML`属性和jQuery的`replaceWith()`方法来替换HTML节点。具体实现方式如下： ```javascript // 获取需要替换的HTML节点 var oldNode = $('#old-node'); // 创建新的HTML节点 var newNode = $('<div id="new-node">New Node</div>'); // 使用replaceWith()方法替换节点 oldNode.replaceWith(newNode[0].outerHTML); ``` 其中，`$('#old-node')`和`$('<div id="new-node">New Node</div>')`分别为获取旧节点和创建新节点的jQuery选择器。`newNode[0].outerHTML`将新节点转换为HTML字符串，然后替换旧节点。注意，这里使用了数组下标 `[0]` 来获取新节点的DOM元素，因为 `outerHTML` 属性只能在DOM元素上使用。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值