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

jQuery知识点(4)-.html() .text() .val() .attr()获取元素内容、值、属性

2017-11-22 17:02 776 查看

知识点：元素

所谓元素指的是一个html文档中一个闭合标签，比如body元素指的就是从

<body>到</body>

的所有代码。

知识点：内容、值、属性

举个例子

<div id="div1">
请输入：<input type="text" value="hello"/>
</div>

这其中，div元素的内容就是

请输入：<input type="text" value="hello"/>

，div有一个属性为id，该属性的值为div。

input元素有一个值为hello。

这样获取元素的内容、属性、值的jQuery方法分别为

.html()、.attr()、.val()

，还有一个特殊的.text()方法，用来获取元素内容中的文本部分，例如div1的text()即为

请输入

。

示例：.html() .text() .val() .attr()用法

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script src="jquery.min.js"></script>
<title></title>
</head>
<body>
<div id="div1">
<input id="text1" type="text" value="hello input value"/>
hello div1 text
<select id="select1">
<option>math</option>
<option>english</option>
</select>
</div>
div1.html()<br/>
<span id="span1"></span><br/>
div1.text()<br/>
<span id="span2"></span><br/>
div1.val()<br/>
<span id="span3"></span><br/>
text1.val()<br/>
<span id="span4"></span><br/>
text1.attr("type")<br/>
<span id="span5"></span><br/>
select1.val()<br/>
<span id="span6"></span><br/>
<script>
$("#span1").html($("#div1").html());
$("#span2").html($("#div1").text());
$("#span3").html($("#div1").val());
$("#span4").html($("#text1").val());
$("#span5").html($("#text1").attr("type"));
$("#span5").html($("#text1").attr("type"));
$("#span6").html($("#select1").val());
</script>
</body>
</html>

输出结果如图：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航