jqury中的html⽅法,jQuery中html()⽅法⽤法实例本⽂实例讲述了jQuery中html()⽅法⽤法。分享给⼤家供⼤家参考。具体分析如下:
jquery在一个元素后追加标签此⽅法能够设置和取得匹配元素的HTML内容,原来的内容将会被新设置的内容替换。
特别说明:
HTML内容就是内容中可以包含HTML标签,并且能够被浏览器渲染。
⽂本内容是先将内容中的HTML预定义字符转换成html字符实体,这样HTML标签就不会被渲染。
语法结构⼀:
复制代码 代码如下:
$(selector).html()
此时⽅法不带参数时候是取得第⼀个匹配元素的html内容。
此⽅法与text()⽅法没有参数⽤法类似,但是还是有很⼤区别:
⼀.html()⽅法取得第⼀个匹配元素的内容,⽽text()⽅法是取得所有匹配元素包含的内容。
⼆.html()⽅法取得内容html内容,⽽text()⽅法取得是⽂本内容。
实例代码:
复制代码 代码如下:
脚本之家
div
{
height:150px;
width:150px;
background-color:green;
margin-top:10px;
}
$(document).ready(function(){
$("button").click(function(){
alert($("div").html());
})
})
脚本之家欢迎您
点击查看效果
以上代码将返回div元素中的内容。
语法结构⼆:
复制代码 代码如下:
$(selector).html(content)
带有参数的时候是设置所有匹配元素⽽的html内容。此⽅法与text()⽅法带有参数的⽤法类似,但是还是有很⼤的区别:html()⽅法设置的是html内容,⽽text()⽅法设置的是⽂本内容。
实例代码:
我是重新设置后的内容"。
以下代码将div中的html内容设置为"我是重新设置后的内容
复制代码 代码如下:
脚本之家
div
{
height:150px;
width:150px;
background-color:green;
margin-top:10px;
}
$(document).ready(function(){
$("button").click(function(){
我是重新设置后的内容");
$("div").html("我是重新设置后的内容
})
})
原来内容
点击查看效果
实例⼆:
复制代码 代码如下:
脚本之家
div
{
height:150px;
width:150px;
background-color:green;
margin-top:10px;
}
$(document).ready(function(){
$("button").click(function(){
好好学习");
$(".html").html("好好学习
$(".text").text("好好学习
好好学习");
})
})
点击查看效果
通过此实例⼤家可以观察⼀下html内容和⽂本内容的区别。希望本⽂所述对⼤家的jQuery程序设计有所帮助。

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。