Jquery获取和修改dom元素的属性值

时间：2022-08-13 21:07:00

获取内容的方式： - text()、html() 以及 val()

三个简单实用的用于 DOM 操作的 jQuery 方法：

  • text() - 设置或返回所选元素的文本内容
  • html() - 设置或返回所选元素的内容（包括 HTML 标记）
  • val() - 设置或返回表单字段的值
代码： 

<!DOCTYPE html>
<html>

<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery-1.12.1.js"></script>
</head>

<body>
<script>
function showInputVal() {
value = $("#input").val();
alert(value);
}

function changeInputVal() {
value = $("#input").val("毛毛");
alert(value);
}

function showtext() {
value = $("#div1").text();
alert(value);
}

function showhtml() {
value = $("#div1").html();
alert(value);
}

function getAttr() {
value = $("#herf1").attr("href");
alert(value);
}
</script>
<div id="div1">第一个<strong>div</strong></div>
<input type="button" value="showtext" onclick="showtext()" />
<input type="button" value="showhtml" onclick="showhtml()" />
<br />
<input id="btn1" type="button" value="获取属性attr" onclick="getAttr()" />
<a href="index.html" id="herf1">超链接</a>
<p>Name:
<input type="text" id="input" value="雷盼">
</p>
<input type="button" value="showInputValue" onclick="showInputVal()" />
<input type="button" value="changeInputValue" onclick="changeInputVal()" />
</body>

</html>


标签：

相关文章