Jquery中替换节点的方法replaceWith()和replaceAll()

  •   
  • 4286
  • jQuery
  • 2
  • super_dodo
  • 2015/10/12

在jquery中，我们可以通过replaceWith()和replaceAll()方法来替换元素中的节点。两者使用的语法格式：


replaceWith(content) : 将所有选择的元素替换成指定的html和dom元素。其中参数被选择替换的内容。

replaceAll(selector) : 替换指定的selector元素。

示例：在下面的页面中存在两个span标记。通过上面两个函数分别替换元素的内容

<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Jquery中替换节点的方法replaceWith()和replaceAll()</title>
	<script src="jquery.js"></script>
</head>
<body>
<script type="text/javascript">
	$(function() {
		$("#Span1").replaceWith("<span title='replaceWith'>Rainier</span>");
		$("<span title='replaceAll'>han163@163.com</span>").replaceAll("#Span2");
	})
</script>

<p>姓名：<span id="Span1"></span></p>
<p>邮箱：<span id="Span2"></span></p>
	
</body>
</html>

//替换后的HTML结构为(局部)
<p>姓名：<span title="replaceWith">Rainier</span></p>
<p>邮箱：<span title="replaceAll">han163@163.com</span></p>

注意: replaceWith() 与replaceAll() 方法都可以实现元素节点的替换.二者最大的区别在于替换字符的顺序，前者是用括号中的字符替换所选择的元素，后者是用字符串替换括号中所选择的元素。同时，一旦完成替换，被替换元素中的全部事件都将消失。

多思考，多创新，才是正道！