在控制台中出现“document.getElementByClassName 不是函数”错误

Question

如何解决此错误的任何想法：“document.getElementByClassName 不是函数”代码如下：HTML：<a href="#" class="filter-btn" onclick="myFunction()" data-filter="opd-list-id-<?php echo $item->ID; ?>" style="background:<?php echo $filter_background_color ?>;color:<?php echo $filter_text_color ?> !important;">JSfunction myFunction() {var elmnt = document.getElementByClassName("filter-btn");elmnt.scrollIntoView(); }

Answer 1

替换getElementByClassName为getElementsByClassName

请注意，它的复数 ( Elements) 以“ s”结尾，而不是单数 ( Element)

同一个类可以添加到多个对象，因此，按类名选择会返回多个项目，而不仅仅是一个，因此它使用复数形式Elements而不是元素，getElementById()因为 id 必须是唯一的，而按 id 选择将只返回一个 DOM 元素

并且，由于该函数getElementsByClassName返回的元素数组elmnt.scrollIntoView()不起作用，

因此您需要使用数组的第一个元素作为elmnt[0]

所以你的代码将是

function myFunction() {

  var elmnt = document.getElementsByClassName("filter-btn");

  elmnt[0].scrollIntoView(); 

}

但是，getElementById如果您只想选择一个元素并使用如下（首先给IdGivenToTheAnchoreTag锚标记提供 id ），我宁愿建议使用

function myFunction() {

  var elmnt = document.getElementById("IdGivenToTheAnchoreTag");

  elmnt.scrollIntoView(); 

}

Answer 2

您正在寻找getElementsByClassName. 注意元素上的“s”

function myFunction() {

  var elmnt = document.getElementsByClassName("filter-btn");

  test.scrollIntoView();  

}