您的位置：首页 > Web前端 > JQuery

JQuery的html函数(元素内容)

2012-11-09 22:21 232 查看
html()函数三种重要操作

$(selector).html()

$(selector).html(text)

$(selector).html(function(){return text})

html()函数：获得元素的内容。

html(text)函数：设置元素的内容。

html(function(){return text})函数：通过函数设置元素的内容。

注：jquery的html函数和js中的innerHTML是一样的。

例子：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>html函数的使用</title>

<script type="text/javascript" src="jquery-core/jquery-1.8.0.js"></script>

<script type="text/javascript">

//jquery的html函数和js中的innerHTML是一样的

$(document).ready(function(){

//获得标签中的值

alert("jquery的html函数："+$("p").eq(0).html()+

"\njs的innerHTML："+document.getElementById("p2").innerHTML);

//设置标签中的值

$("p").eq(2).html("我现在设置的是第三个p标签的值");

document.getElementById("p4").innerHTML="我现在设置的是第四个p标签的值";

//使用Jquery函数的方式设置值

$("#p5").html(function(){

return "我现在设置的是第五个p标签的值"

});

});

</script>

</head>

<body>

<p>这是一个p标签</p>

<p id="p2">这是一个p2标签</p>

<p></p>

<p id="p4"></p>

<p id="p5"></p>

</body>

</html>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航