val | 取值 |
---|---|
html | 获取元素内容,如果有子元素,保留标签 |
text | 获取元素内容,如果有子元素,不包含子元素标签 |
取值val()
相当于document.getElementById("input").value;
<script scr="https://how2j.cn/study/jquery.min.js"></script>
<script>
$(function(){
$("#b1").click(function(){
alert($("#input1").val());
});
});
</script>
<body>
<button id="b1">取值</button>
<br>
<br>
<input type="text" id="input1" value="默认值"></input>
</body>
获取元素内容html()
通过html() 获取元素内容,如果有子元素,保留标签
<script scr="https://how2j.cn/study/jquery.min.js"></script>
<script>
$(function(){
$("#b1").click(function(){
alert($("#div1").html());
});
});
</script>
<body>
<button id="b1">获取元素</button>
<br>
<br>
<div id="div1">
这是div的内容
<span>这是div中的span</span>
</div>
</body>
显示效果:
获取元素text()
通过text() 获取元素内容,如果有子元素,不包含标签
<script scr="https://how2j.cn/study/jquery.min.js"></script>
<script>
$(function(){
$("#b1").click(function(){
alert($("#div1").text());
});
});
</script>
<body>
<button id="b1">获取元素</button>
<br>
<br>
<div id="div1">
这是div的内容
<span>这是div中的span</span>
</div>
</body>
显示效果: