如何使用Javascript或jQuery使此代码更有效?

如何使用Javascript或jQuery使此代码更有效?,javascript,jquery,Javascript,Jquery,我想通过为所有链接提供公共类来创建10个体内链接。然后你可以用like $(".className").click(function(){ alert($(this).attr("href")); }); 您不必为每个锚定标记提供内联调用,我将使用带有data-*属性的jQuery事件处理程序,如 <ul> <li><a href="#" class="fillYellow" data-target=".yellow">Using our site&

我想通过为所有链接提供公共类来创建10个体内链接。然后你可以用like

$(".className").click(function(){ alert($(this).attr("href")); });

您不必为每个锚定标记提供内联调用,我将使用带有data-*属性的jQuery事件处理程序,如

<ul>
    <li><a href="#" class="fillYellow" data-target=".yellow">Using our site</a></li>
    <li><a href="#" class="fillYellow" data-target=".yellow1">NonUsing our site</a></li>
    <li><a href="#" class="fillYellow" data-target=".yellow2">Blablba our site</a></li>
</ul>
<h2 class="painted yellow">Using our site</h2>
<h2 class="painted yellow1">NonUsing our site</h2>
<h2 class="painted yellow2">BLAbla our site</h2>
演示:

  • 将类
    fillYellow
    添加到所有触发器元素
  • 向触发器元素添加一个
    数据目标
    属性,该属性的选择器值指向必须高亮显示的元素
  • 添加单独的类,如
    yellow
    yellow1
    ,。。。等目标元素

OP没有使用jQuery。他是JS新手,而jQuery在这里的表现方式,对于很多新手来说,如果jQ==JS,我并不感到惊讶。因为我认为jQuery可以有所帮助@AnoopJoshi你能上传小提琴/jsbin吗?我是新来的,不知道该去哪里it@rolory:jQuery/can/help,但是,您必须大声说1)正在使用它,2)需要关于如何使用jQuery改进代码的指导。您想要更高效吗?使用合理的缩进!有一个适合懒汉的工具:。
<ul>
    <li><a href="#" class="fillYellow" data-target=".yellow">Using our site</a></li>
    <li><a href="#" class="fillYellow" data-target=".yellow1">NonUsing our site</a></li>
    <li><a href="#" class="fillYellow" data-target=".yellow2">Blablba our site</a></li>
</ul>
<h2 class="painted yellow">Using our site</h2>
<h2 class="painted yellow1">NonUsing our site</h2>
<h2 class="painted yellow2">BLAbla our site</h2>
jQuery(function ($) {
    $('.fillYellow').click(function () {
        var $target = $($(this).data('target')).css('background', 'yellow');
        setTimeout(function () {
            $target.css('background', '#e5e5e5');
        }, 3000);
    })
})