Javascript 单击一个图元将高亮显示其他图元

单击另一个元素时，是否有任何方法可以更改元素的属性？例如，考虑这种方法，在这里我有一个链接，例如：

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

这意味着每当单击链接时，

重要文本

都会更改其颜色。这种方法的问题是，页面也会滚动，即使只有一点点。有没有其他不滚动页面的方法

---

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

这将适用于多个链接：

将css更改为：

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

为您的链接提供一个通用类，即

link

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

---

在

链接中添加属性
数据id
（或其他名称），以指定关联
span
的id



下面是javascript：

window.onload=函数（）{
var alinks=document.getElementsByTagName（'a'）；
对于（变量i=0；i

请参见
中的示例，假设这样的方法适合您：

CSS:

HTML:

这样，任何链接（即使它是在执行上述代码之后添加的）都将运行一个函数，如果它有一个数据目标属性，它将被用作jquery选择器来查找应该高亮显示的元素

UPD:

更改以反映David Fregoli指出的目标行为（一次只能突出显示一个元素

    $("a").bind('click',function(e){
          if(!$("span.clickTarget").hasClass('changeTextColor')){
             $("span.clickTarget").addClass('changeTextColor');
           }
     });

css:

我知道它不能回答这个问题，但是你可以在同一个html文件中包含整个jQuery。你可以下载jQuery源代码，存储在本地存储器中，并包含在网页中。真的吗？好吧，这简化了事情。。。现在允许使用jQuery。
解决了滚动问题，为什么需要使用jQuery？@adeneo-return false还将阻止目标元素的颜色更改这将使以前选择的任何元素高亮显示。合理的。我错过了
：target的行为。在我看来，你的答案最简单、最清晰，但我无法让它发挥作用。我在页面的开头添加了这两行：
，links.js文件中包含了您编写的代码。我还需要做点别的吗？我对jquery非常陌生。在link.js$（document.ready（function（）{上面的代码}）中添加这样的代码；在jQuery之后必须包含
脚本
链接
links.js
。js中的代码应该是
$（document.ready）（function（）{//mycode}）的包装器
或者，您可以将
脚本
标记放在html页面的底部，而不是头部。
$('a.link').on('click', function() {
   $('.target').removeClass('target');
   var id = $(this).attr('href');
   $(id).addClass('target');
   return false;
});

   .target{
       color:#4f8dd5;
    }   

<a href="#" data-target="#100">click me<a>

$(document).on("click", "a", function(e) {
   if($(this).data("target")) {
     e.preventDefault(); //just to avoid # appearing in address after click.
     $(".target").removeClass("target");
     $($(this).data("target")).addClass("target");
   }
})

    $("a").bind('click',function(e){
          if(!$("span.clickTarget").hasClass('changeTextColor')){
             $("span.clickTarget").addClass('changeTextColor');
           }
     });

    .changeTextColor {
         color: #4f8dd5;
    }