<!DOCTYPE html>
<html>
<head>
<title>用法手册</title>
<meta charset="utf-8">
</head>
<body>
<!-- appendTo() 方法在被选元素的结尾(仍然在内部)插入指定内容。-->
<!-- prependTo() 方法在被选元素的开头(仍位于内部)插入指定内容。-->
<!-- insertAfter() 方法在被选元素之后插入 HTML 标记或已有的元素。 -->
<!-- insertBefore() 方法在被选元素之前插入 HTML 标记或已有的元素。-->
<p>这是第一句话</p>
<p>这是第二句话</p>
<button class="btn">在每个 p 元素的结尾添加内容</button>
<h3>这是话</h3>
<button class="btn1">在 h3 元素的开头插入文本</button>
<b>1</b>
<button class="btn2">在 h3 元素插入html元素</button>
<h4>2</h4>
<button class="btn3">在 h4 元素zhiqian插入html元素</button>
</body>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".btn").click(function(){
$("<b> Hello World!</b>").appendTo("p");
});
});
$(document).ready(function(){
$(".btn1").click(function(){
$("<b>Hello World!</b>").prependTo("h3");
});
});
$(document).ready(function(){
$(".btn2").click(function(){
$("<span>你好!</span>").insertAfter("b");
});
});
$(document).ready(function(){
$(".btn3").click(function(){
$("<span>你好!</span>").insertBefore("h4");
});
});
</script>
</html>点击 "运行实例" 按钮查看在线实例
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号