为什么getElementsByClassName不起作用

Why getElementsByClassName does not work?

本文关键字:不起作用 getElementsByClassName 为什么      更新时间:2023-09-26

我试图检测屏幕分辨率,然后为多个屏幕分辨率设置位置(如顶部、左侧),但它不起作用。有人知道我的代码出了什么问题吗?

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>

document.getElementsByClassName()返回一个nodeListHTMLCollection,它们都是元素列表,而不是单个元素。即使只有一个匹配元素,它仍然返回一个只有一个项目的列表。因此,您必须获取列表中的第一个项目,或者遍历整个列表(取决于您的代码想要什么)。

从列表中获取第一个项目(如果您可以假设只有一个项目具有类名):

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";
}

用作

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

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

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

在页面底部使用此选项。

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