javascript - 单击一个元素突出显示其他元素

Question

有没有办法在点击另一个元素时改变一个元素的属性？例如，考虑这种方法，我有一个这样的链接:

<a href="#100">Click me!</a>

然后靠近它我有这个:

<span id="100" class="clickTarget">Important text</span>

然后在我的 css 文件中有这个:

.clickTarget:target {
    color: #4f8dd5;
}

这意味着无论何时单击链接，重要文本 都会更改其颜色。这种方法的问题是页面也会滚动，即使只有一点点。还有其他不滚动页面的方法吗？

如果您认为合适，您可以使用 jQuery。

Answer 1

这将适用于多个链接:

将您的 css 更改为:

.clickTarget.target {
    color: #4f8dd5;
}

给你的链接一个通用类，即 link

$('a.link').on('click', function() {
   $('.target').removeClass('target');
   var id = $(this).attr('href');
   $(id).addClass('target');
   return false;
});

http://jsfiddle.net/8S5mD/2/