jquery如何替换dom元素

本文小编为大家详细介绍“jquery如何替换dom元素”，内容详细，步骤清晰，细节处理妥当，希望这篇“jquery如何替换dom元素”文章能帮助大家解决疑惑，下面跟着小编的思路慢慢深入，一起来学习新知识吧。

成都创新互联公司专注为客户提供全方位的互联网综合服务，包含不限于网站设计制作、成都做网站、舒兰网络推广、成都微信小程序、舒兰网络营销、舒兰企业策划、舒兰品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等，从售前售中售后，我们都将竭诚为您服务，您的肯定，是我们最大的嘉奖；成都创新互联公司为所有大学生创业者提供舒兰建站搭建服务，24小时服务热线：028-86922220，官方网址：www.cdcxhl.com

方法：1、利用replaceWith()方法，该方法用于集合中所有匹配的元素，语法为“元素对象.replaceWith(content,function(index))”；2、利用replaceAll()方法，该方法用于把被选元素替换为新的HTML元素，语法为“元素对象.replaceAll(selector)”。

本教程操作环境：windows10系统、jquery3.4.1版本、Dell G3电脑。

jquery替换dom元素

1、replaceWith() 方法

$(selector).replaceWith(content,function(index))

content 必需。规定要插入的内容（可包含 HTML 标签）。

可能的值：

• HTML 元素

• jQuery 对象

• DOM 元素

function(index) 可选。规定返回替换内容的函数。

index - 返回集合中元素的 index 位置。

$(DOM).replaceWith(newContent) 用于替换集合中所有匹配的元素，并且返回被删除的元素集合：

$('document').ready(function (){
$('body>input').click(function (){
$('body>ul>li:gt(1)').replaceWith('
替换后的元素
')
})
})





第一个
第二个
第三个
第四个

输出结果：

2、replaceAll() 方法

$(newContent).replaceAll(DOM) 与 $(DOM).replaceWith(newContent) 方法功能一样，只不过是参数位置调换了一下（可以直接在后面赋予样式）：

$('document').ready(function (){
$('body>input').click(function (){
$('
替换后的元素
').replaceAll('body>ul>li:gt(1)').css('color','orange');
})
})





第一个
第二个
第三个
第四个

输出结果：

读到这里，这篇“jquery如何替换dom元素”文章已经介绍完毕，想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会，如果想了解更多相关内容的文章，欢迎关注创新互联行业资讯频道。