我在一个 HTML 页面上使用 HTML、CSS、jQuery 和 JavaScript。通常，我第一次尝试弄清楚如何从 HTML 正文访问信息以在我的 JavaScript 代码中使用。
我想在 JavaScript 中设置一个变量，该变量等于我的 <div> 之一的数据属性中包含的字符串。元素。
我可以使用 document.getElementsByClassName()[] 吗？在我的 JavaScript 中实际从 HTML 文档中提取信息？在 W3schools 和其他地方的示例中，我只看到它用于更改某些 HTML 元素的值，而不是实际使用其输入。这里有我缺少的更基本的东西吗？
____这是我更具体的代码(其中 div.onlyOne 是该类的唯一 div，并且具有数据需要属性“我需要的字符串”):
var myVar = document.getElementsByClassName("onlyOne")[0].getAttribute("data-need")
为什么这不会将“我需要的字符串”存储到 myVar 中？ ？
最佳答案
尽管如此，但请确保在标记或 DOM 加载后运行脚本，否则脚本将找不到该元素，因为它尚未加载。
在标记之后
<!DOCTYPE html>
<html>
<head>
<style>
</style>
</head>
<body>
<div class="onlyOne" data-need="hey there"></div>
<script type="text/javascript">
var myVar = document.getElementsByClassName("onlyOne")[0].getAttribute("data-need");
alert(myVar);
</script>
</body>
</html>
DOM 加载
<!DOCTYPE html>
<html>
<head>
<style>
</style>
<script>
document.addEventListener("DOMContentLoaded", function(event) {
var myVar = document.getElementsByClassName("onlyOne")[0].getAttribute("data-need");
alert(myVar);
});
</script>
</head>
<body>
<div class="onlyOne" data-need="hey there"></div>
</body>
</html>
我可以建议您以后使用 document.querySelector('.onlyOne') 代替。这样您就可以更有效地缩小结果列表的范围。
来源:https://developer.mozilla.org/en-US/docs/Web/API/Document/querySelector
关于javascript - .getElementsByClassName()[]——我不明白什么？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35964917/