博客列表 >0408 作业

0408 作业

XuanGG的博客
XuanGG的博客原创
2018年04月09日 17:36:52632浏览

实例

<!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>

运行实例 »

点击 "运行实例" 按钮查看在线实例


声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议