javascript - 通过 'class' 而不是 'id' 引用元素

标签 javascript getelementbyid

我正在尝试引用新闻网站中的元素(以获取文本片段)并以简单的方式显示它们。

我观看了有关引用元素的 YouTube 教程,它使用“getElementById”引用了段落。

我想使用的网站不太使用'Id=',它主要使用'class=',所以我不能使用同样的方法。

我尝试将上面的“getElementById”替换为“getElementsByClassName”,但得到的答案是“未定义”。

代码:

<html lang="en">
<body>
<p class="para1" > this is the 1st paragraph </p>
<p> <br/> </p>
<p> <br/> </p>
<p> <br/> </p>
<p class="para2" > this is the 2nd paragraph </p>
</body>
</html>

<script type="text/javascript">
var input=document.createElement("input");
input.type="button";
input.value="Check";
input.onclick = showAlert1;
input.setAttribute("style", "font-size:18px;position:absolute;top:100px;right:40px;");
document.body.appendChild(input);//Placement of check button on website;

function showAlert1()
{
alert(document.getElementsByClassName('para2').innerHTML);
}
</script>

最佳答案

getElementsByClassName 返回元素的集合(如数组)。因此,您需要使用索引来访问它们,如下所示:

document.getElementsByClassName("someClass")[0];

//Or if you want to access all
var len = document.getElementsByClassName("someClass").length;
for(var i=0;i<len;i++){
 //access like document.getElementsByClassName("someClass")[i]
}

就你的情况

document.getElementsByClassName('para2')[0].innerHTML

关于javascript - 通过 'class' 而不是 'id' 引用元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30625291/

相关文章:

javascript - AngularJS 注入(inject)器问题

javascript - 从 CodeBehind 调用 JavaScript 函数无法填充 getElementbyID

Javascript:无法使用 getElementById 获取元素

javascript - 如何使用多个 document.getElementById 的?

javascript - 如何在 Chrome DevTools 中调试 ajax 请求中加载的 js

javascript - 标题中的多个按钮

javascript - 如何使用 JSON 文件在 HTML 中动态创建元素

javascript - 从数据绑定(bind) list 中进行 jQuery 查找

javascript - 像这样的东西。getelementbyid(这个div内元素的id)

Javascript 通过 id 隐藏和显示元素不适用于多种情况