HTML 是构建 Web 页面的基础语言，它定义了页面的结构和内容。有时，我们需要更改页面中一些标记的类型，这时候就可以使用 jQuery 来实现。
1. jQuery 是什么？
jQuery 是一个 JavaScript 库，它简化了基于 JavaScript 的 HTML 文档遍历和操作、事件处理、动画和 AJAX 操作等任务。它是编写跨浏览器代码的最佳工具之一。
2. 将一个标记替换为另一个标记
在 HTML 中，每个元素都由一个或多个开始标记和一个结束标记组成。如果我们想将一个标记替换为另一个标记，可以使用 jQuery 中的 .replaceWith() 方法。
2.1 基本用法
.replaceWith() 方法接受一个参数，即要替换的新元素。下面是一个简单的例子：
<div id="old">旧的 div</div>
$(document).ready(function() {
$('#old').replaceWith('<span>新的 span</span>');
});上面的代码将 id 为 old 的 div 元素替换为一个 span 元素。
2.2 替换后绑定事件
在替换后，新元素可能需要绑定事件。我们可以在替换前先保存旧元素的事件并在替换后重新绑定。下面是一个例子：
-- -------------------- ---- ------- ---------------------------- - -- ---------- --- --- - ---------- --- ------ - --------------- ---------- -- ------ ---------------------- ----------- -------------- -- ------- --------------------- ---
2.3 替换多个元素
如果要替换多个元素，可以使用 .each() 方法遍历所有元素并依次替换。下面是一个例子：
<div class="old">旧的 div 1</div> <div class="old">旧的 div 2</div> <div class="old">旧的 div 3</div>
$(document).ready(function() {
$('.old').each(function() {
$(this).replaceWith('<span>新的 span</span>');
});
});上面的代码将 class 为 old 的所有 div 元素替换为 span 元素。
3. 总结
使用 jQuery 可以轻松地将 HTML 页面中一个标记替换为另一个标记。.replaceWith() 方法可以实现此功能，并且可以在替换后重新绑定事件。如果要替换多个元素，可以使用 .each() 方法遍历所有元素并依次替换。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/11143
