javascript - 使用 X 类 JavaScript 更改所有链接的颜色

Question

Link with example

我正在使用以下功能:

<div align="center"><a href="#" onclick="changeColor('A'); return false;">A</a>
<script>
    function changeColor(id)
    {
        document.getElementById(id).style.color = "#FFF"; // forecolor
        document.getElementById(id).style.backgroundColor = "#ff0000"; // backcolor
    }
</script>

例如，当我单击示例页面上的 A 时，只有第一个链接正在更改颜色，因为脚本正在按 id 更改颜色。如何按类别更改所有链接颜色？

我想要的是，当我点击 A 时，所有 A 类链接都应该改变颜色，当我点击 B 时，所有 B 类链接都应该改变颜色，等等。

Answer 1

function changeColor( _class ) {
    var elems = document.getElementsByClassName( _class );
    for (var i=elems.length; i--;) {
        elems[i].style.color = "#FFF";
        elems[i].style.backgroundColor = "#ff0000";
    }
}

FIDDLE

将函数更改为上面的函数，并向其传递一个类？

jQuery 版本:

$('div[align="center"] > a').on('click', function(e) {
    e.preventDefault();
    $('.' + $.trim($(this).text())).css({color: '#fff', backgroundColor: '#ff0000'});
});

使用 HTML

<div align="center"><a href="#">A</a></div>

FIDDLE