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

实例说明jquery中html()、text()、val()方法的区别

2017-01-14 11:24 561 查看
1、html()

读取和修改元素的HTML标签。对应js中的innerHTML。

2、text()

读取或修改元素的纯文本内容。对应js中的innerText。

3、val()

读取或修改表单元素的value值。

val()只能使用在表单元素上,html()和text()方法不是被用于表单元素。

<!DOCTYPE html>
<html>
<head>
<script src="/jquery/jquery-1.11.1.min.js"></script>
<script>
$(document).ready(function(){
$("#btn1").click(function(){
alert("label's Text: " + $("#test-label").text());   //label's Text:tttt。
});
$("#btn2").click(function(){
alert("label's HTML: " + $("#test-label").html());//label's HTML:t<b>tt</b>t。
});
$("#btn3").click(function(){
alert("input's Value: " + $("#test-input").val());//input's Value:vv
});
$("#btn4").click(function(){
alert("input's Text: " + $("#test-input").text());//input's Text:
});
});
</script>
</head>

<body>
<label id="test-label">t<b>tt</b>t。</label>
<input id="test-input" value="vv">xx</input>
<button id="btn1">显示label的文本</button>
<button id="btn2">显示label的HTML</button>
<button id="btn3">显示input的Value</button>
<button id="btn4">显示input的文本</button>
</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  jquery html 表单 标签