为什么getElementsByClassName不起作用？

Question

我正在尝试检测屏幕分辨率，然后为多个屏幕分辨率设置位置（例如顶部，左侧），但是它不起作用。 有人知道我的代码有什么问题吗？

CSS：

.Scrolloutside
{
  position:relative;
  left: 550px;
 }

JavaScript的：

  var nHeight = screen.height;
  var nWidth = screen.width; 
  if (nHeight ==714 && nWidth==1005)
 {
   //document.write("height:"+nHeight+" ,width="+nWidth+"<br>");
   var newsTarget = document.getElementsByClassName('Scrolloutside');
   newsTarget.style.top= "500px";
  }

HTML：

<div class = "Scrolloutside">
    <div class="scroller_title">News</div>
<div class="scroller_container">
    <div class="jscroller2_up">
    <?
    echo $secnews;
    ?>
    </div>
</div>
</div>
</div>

Answer 1

document.getElementsByClassName()返回一个nodeList或HTMLCollection ，它们都是元素列表，而不是单个元素。 即使只有一个匹配元素，它仍会返回仅包含一项的列表。 因此，您必须获取列表中的第一项，或者遍历整个列表（取决于您的代码需要什么）。

从列表中获取第一项（如果您可以假设只有一个具有类名的项）：

var newsTarget = document.getElementsByClassName('Scrolloutside');
newsTarget[0].style.top= "500px";

或遍历列表（如果可能有多个具有该类名称的项目）：

var newsTarget = document.getElementsByClassName('Scrolloutside');
for (var i = 0; i < newsTarget.length; i++) {
    newsTarget[i].style.top= "500px";
}

Answer 2

用于

newsTarget[0].style.top= "500px";

getElementsByClassName()方法以NodeList对象的形式返回文档中具有指定类名的所有元素的集合。

NodeList对象代表节点的集合。 可以通过索引号访问节点。 索引从0开始

Answer 3

在页面底部使用它。

newsTarget[0].style.top= "500px";