Question

我试图对wordpress主题进行一些推文，并且只在某些页面上使用某些javascript隐藏某个div，我提出的代码是：

if(document.getElementsByClassName("page-title") === "NEW ARRIVALS"){
    document.getElementById("pull_9").style.visibility="hidden";
}else if(document.getElementsByClassName("page-title") === "SALE"){
    document.getElementById("pull_9").style.visibility="hidden";
}else{
    document.getElementById("pull_9").style.visibility="visible";
};

但它不起作用，我知道getElementByClassName（）还没有支持，但它会满足这些要求。

任何人都可以看到为什么这不起作用？它可能非常简单（我是javascript的新手）但我理论上无法理解为什么它不应该工作。

Answer 1

document.getElementsByClassName返回一组元素。您可能想要遍历集合，或Array.filter集合......或者只是通过括号表示法获取集合中的第一个元素。

var set = document.getElementsByClassName('whatever');

var item = document.getElementsByClassName('whatever')[0];

https://developer.mozilla.org/en-US/docs/Web/API/document.getElementsByClassName

此外，所有桌面和移动浏览器目前都支持getElementsByClassName：

http://caniuse.com/#search=getelementsbyclassname

Answer 2

如果jQuery没问题，您可以使用:contains选择器和toggle方法

var show = !$('.page-title:contains(NEW ARRIVALS), .page-title:contains(SALE)')
            .length; 
$('#pull_9').toggle(show);

Working demo

Answer 3

NEW ARRIVALS＆amp; SALE这些元素的内容？

如果page-title引用<title>标记，则可以使用

document.querySelector('title').textContent

如果page-title引用了一个项目或第一项，您可以尝试：

document.querySelector('.page-title').textContent

或者......

var elem = document.getElementsByClassName('page-title');

for (var i = 0, len = elem.length; i < len; i++) {

  if (elem[i].textContent === 'NEW ARRIVALS' || 
      elem[i].textContent === 'SALE') {
    document.getElementById('pull_9').style.visibility = 'hidden'; 
    break;     
  }
}

或....

for (var i = 0, len = elem.length; i < len; i++) {

  if (elem[i].textContent.match(/NEW ARRIVALS|SALE/)) {
    document.getElementById("pull_9").style.visibility = 'hidden';
    break;    
  }
}

通常有很多方法可以达到同样的目标。

如果它只是您的代码所引用的一个元素......那么例如

if (document.querySelector('.page-title').textContent.match(/NEW ARRIVALS|SALE/)) {
  document.getElementById('pull_9').style.visibility = 'hidden'; 
}

如果页面的标题=“x”，试图隐藏div

3 个答案: