1、创建html页面,打开记事本,输入如下截图所示的html代码,将文件保存为html结尾的文件,例如JsTest.html。
2、上一步保存完成后,双击文件即可使用默认浏览器运行页面,如果想使用指定浏览器运行,右键文件,选择【打开方式】->挑选任一已经安装的浏览器即可。
3、原生JS方式,详细代码与注释见截图。
4、原生JS方式,运行效果如下。
5、凳答轮Jquery方式,必须要举基引入jquery文件才能使用,此处将jquery下载下来放到Content文件夹中,新的目录结构如下
-- Content
-- jquery-1.11.3.min.js
-- JsTest.html
6、Jquery方式,详细代码与相关注释见截图。
7、Jquery方式,运行效果如下枣信。
append()方法默认是添悔穗加到指定元素的最后的。
可以采用如下方式将内容添加到元素的最前面。
使雹高用after()方法,在匹碧肆卜配的元素之后添加内容。
获取到容器的第一个元素,然后使用insertBefore()方法,将内容添加到该元素之前。
本文实例讲述了jQuery使用before()和after()在元素前后添加内容的方法。分享给大家供大家参考。具体如下:<!DOCTYPE
html>
<html>
<head>
<script
src="js/jquery.min.js">
</script>悉明哪
<script>
$(document).ready(function(){
$("#btn1").click(function(){
$("img").before("<b>Before</b>")
})
$("#btn2").click(function(){
$("img").after("<i>After</i>")
})
})
</script>
</head>
<body>
<img
src="/images/w3jquery.gif"
alt="jQuery"
width="100"
height="140">
<br><br>
<button
id="btn1">Insert
before<槐吵/button>
<button
id="btn2">Insert
after</button>睁码
</body>
</html>
希望本文所述对大家的jQuery程序设计有所帮助。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)