Question

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

我观看了有关引用元素的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>

Answer 1

getElementsByClassName返回元素集合（如数组）。因此，您需要使用indexes来访问那些：

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

Answer 2

you have to add the script after html tag.

<div class="increased">hi</div> <!-- first specify the tag-->
<script type="text/javascript"> <!-- then call in script-->
var i = 23;
var elems=document.getElementsByClassName("increased");
for(var k = 0; k < elems.length; k++) {
elems[k].style.size = '100px';
}
</script>

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

2 个答案: