在学习JavaScript的过程中,我们经常需要获取节点的属性值内容,而js中获取属性值有两种方式。通过下面的案例来展示:[HTML] 纯文本查看 复制代码 <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>04_getAttribute方法的使用</title>
</head>
<body>
<a href="#" id="url"/>
</script>
</body>
</html>
以上面的代码为例,如果我们需要获取<a>标签中的href属性值,第一种方式如下:
[HTML] 纯文本查看 复制代码 <script type="text/javascript">
var url = document.getElementById("url");
var href = url.href;
document.write(href);
</script>
我们将获取的字符串在浏览器显示出来,结果如下:
[HTML] 纯文本查看 复制代码 http://127.0.0.1:8020/Day024/html/%E8%87%AA%E4%B9%A0/04_getAttribute%E6%96%B9%E6%B3%95%E7%9A%84%E4%BD%BF%E7%94%A8.html?__hbt=1559616231501#
另一种方式如下:
[HTML] 纯文本查看 复制代码 <script type="text/javascript">
var url = document.getElementById("url");
var href = url.getAttribute("href");
document.write(href);
</script>
将其结果显示在浏览器页面,结果如下:
可以看出通过上面两种方式获得的属性值差异还是很大的,第一种方式将超出了我们的预期,添加了很多附加信息,但这些可能并不是我们想要的。更多的时候,我们只需要属性值引号范围内的内容,所以在以后的应用中,我们最好是使用getAttribute()方法获取节点的属性值内容,这样获得的结果更方便我们后续的操作。
|