将 <a> 标签从 css 调用到 javascript 函数中答案

【问题标题】：Call <a> tag from css into javascript function将 <a> 标签从 css 调用到 javascript 函数中
【发布时间】：2014-12-28 05:39:54
【问题描述】：

我正在使用 j08691 的this changing color script：

function flash() {
var text = document.getElementById('foo');
text.style.color = (text.style.color=='red') ? 'green':'red';
}
var clr = setInterval(flash, 1000);

我想从 CSS 中调用 <body> 标签和 <a> 标签而不是 id。

对于<body> 标签，我做了这个并且它有效：

function flash() {
var text = document.body;
text.style.color = (text.style.color=='black') ? 'white':'black';
}
var clr = setInterval(flash, 1);

但它不适用于<a> 标签。我尝试了以下变体：

var els = document.getElementsByTagName('a');
var links = document.getElementsByTagName('a');

而不是 var text = document.getElementById('a'); 并将 text.style.color 替换为 links[i].style.color 或 links.style.color 但我不太确定我在那里做什么。

我想一次更改所有链接的颜色。

【问题讨论】：

试试document.querySelectorAll('.a').style.color
在 jquery 中它是一步过程。如果可能，请尝试使用 jquery。

标签： javascript function hyperlink tags call

【解决方案1】：

你在正确的轨道上 - getElementsByTagName 返回一个集合，所以只需遍历集合：

function flash() {
    var links = document.getElementsByTagName('a');
    for (var i = 0; i < links.length; i++) {
      links[i].style.color = (links[i].style.color=='black') ? 'white':'black';
    }
}
setInterval(flash, 1000);

jsFiddle here

还要注意setInterval 需要毫秒，因此不建议使用setInterval(x, 1)。

【讨论】：

谢谢！非常感谢。这完美地工作。间隔 1 为生效；我可以将其设置为 10 或 100。

【解决方案2】：

您是否尝试访问 html 中的 a 标签？然后通过你的函数对每个应用一些 css？

使用 jquery 库

$("a").each(function(){
//do something with the element here like your function.  $(this).stuff;
});

【讨论】：

由于该问题未使用jquery 标记，因此适合快速介绍该库。