根据标题名称更改样式

Question

我在一个网站上工作，如果标题=“ something”，则只需要显示一个div。 我似乎无法实现，我已经尝试了jQuery和javascript，这就是我现在所拥有的。

var title = document.getElementsByTagName("title")[0].innerHTML;
    console.log(title);
    document.getElementsByClassName("book-a-lane").elems[0].style.visibility=     "hidden";
    if(title === "Frisco, TX"){
    document.getElementsByClassName("book-a-lane").elems[0].style.visibility= "block";
    }

Answer 1

您可以通过document.title轻松获得标题。

您要在这里发明一种物业：

document.getElementsByClassName("book-a-lane").elems[0]
// --------------------------------------------^^^^^

getElementsByClassName返回一个列表，它没有elems属性。 还要注意， getElementsByClassName不如querySelector受到很好的支持，在这里更有用。

您还可以大大简化代码。

这是一个例子：

document.querySelector(".book-a-lane").style.visibility =
  document.title === "Frisco, TX" ? "visible" : "hidden";

querySelector使用CSS选择器并返回第一个匹配元素（或null ）。 还有querySelectorAll ，它返回匹配元素的列表。

您可能需要document.title.trim() ，但要注意浏览器对此的支持。

匹配时的实时示例。

没有的实时示例。

Answer 2

可以使用以下方法获取title变量的值： var title = document.title 。

if语句中的行有问题，因为没有visibility: block; 。 它可以是display: block; 或visibility: visible; 。

这是半改进的版本：

var title = document.title;
document.getElementsByClassName("book-a-lane")[0].style.visibility = "hidden";
if (title == "Frisco, TX") {
    document.getElementsByClassName("book-a-lane")[0].style.visibility = "visible";
}

您无需使用.elms即可访问元素。

您甚至可以使用? 进行正确/错误切换的策略：

document.getElementsByClassName("book-a-lane")[0].style.visibility = title == "Frisco, TX" ? "visible": "hidden";

Answer 3

你是说要这么做吗

var title = document.getElementsByTagName("title")[0].innerHTML;

document.getElementsByClassName("book-a-lane")[0].style.visibility="hidden";

if(title === "Frisco, TX"){
    document.getElementsByClassName("book-a-lane")[0].style.visibility= "block";
}

注意缺少elems 。 可以使用数组访问器直接访问getElementsByClassName 。