jQuery中的html(),text()和val()

<body>
<div id="div" value='2'>
        第一个div的内容！
<p id="p1">
            这是p的内容！
</p>
<div id="div">
            第二个div内容！
</div>
</div>
<input type="hidden" id="hidVal" value="1"/>
</body>

html()
它获取的第一个匹配元素的内容，也就是所取得的标签所包含的所有东西。

$(function(){
var s = $("#div1").html();
    console.log(s);
})

控制台打印结果
jQuery中的html(),text()和val()

用html()按以下代码修改指定内容，再获取

$(function(){
    $("#div1").html("---修改后---")
var s = $("#div1").html();
    console.log(s);
})

得到以下结果
jQuery中的html(),text()和val()

text()
它获取的是所有匹配元素的内容，而不会选取标签。
同理，text(val)是设置所有匹配元素的文本内容

$(function(){
var s = $("#div1").text();
    console.log(s);
})

控制台打印结果
jQuery中的html(),text()和val()

用text()按以下代码修改指定内容，再获取

$(function(){
    $("#div1").text("---修改后---")
var s = $("#div1").text();
    console.log(s);
})

控制台打印结果
jQuery中的html(),text()和val()

val()
用来操作标准的表单组件对象，如button,text,hidden.

$(function(){
var s = $("#hidVal").val();
    console.log(s);
})

控制台打印结果为 1

想要修改val值，一般用修改属性及值得attr()方法

$(function(){
    $("#hidVal").attr('value','2');
var s = $("#hidVal").val();
    console.log(s);
})

打印结果为 2

秒客网

jQuery中的html(),text()和val()

相关文章