jQuery 以最佳方式定位特定链接

发布于 2024-10-16 03:05:12 字数 866 浏览 1 评论 0原文

注意：这更多的是一个最好的方式而不是如何的问题。

我在 ul 中有几个我想要定位的链接，但不是每个标签。虽然我知道我可以通过 ID 定位每个元素，但我想知道此任务的最佳实践（最优化的选择、最少的代码量）。

   $("#id").find("a").click(function(){
  //run function                    
});

标记：

    <nav id="id">    
  <ul>
    <li id="want-01"><a href="#">link</a></li>
    <li id="want-02"><a href="#">link</a></li>
    <li id="want-03"><a href="#">link</a></li>
    <li id="dont-want-01"><a href="#">link</a></li>
    <li id="dont-want-02"><a href="#">link</a></li>
    <li id="want-04"><a href="#">link</a></li>
    <li id="want-05"><a href="#">link</a></li>
  </ul>       
</nav>

原文

Note: This is more of a best how rather than how question.

I have several links within a ul that I would like to target but not every single a tag. While I know I can target each element by ID I would like to know what is best practice (most optimized selceting, smallest amount of code) for this task.

   $("#id").find("a").click(function(){
  //run function                    
});

markup:

    <nav id="id">    
  <ul>
    <li id="want-01"><a href="#">link</a></li>
    <li id="want-02"><a href="#">link</a></li>
    <li id="want-03"><a href="#">link</a></li>
    <li id="dont-want-01"><a href="#">link</a></li>
    <li id="dont-want-02"><a href="#">link</a></li>
    <li id="want-04"><a href="#">link</a></li>
    <li id="want-05"><a href="#">link</a></li>
  </ul>       
</nav>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

左耳近心 2024-10-23 03:05:12

在这里使用类似乎是合适的。创建一个新类“li_link”并将其添加到要链接到的 li 元素。然后将您的点击处理程序应用于该类的所有元素，例如。

$('.li_link').click(function() {...});

如果您想更改动态处理的 li 元素，可以考虑使用实时事件。这允许您从 li 元素添加和删除“li_link”类，并且单击处理程序将自动应用或停止应用于 li 元素。

要设置现场活动，请使用如下命令：

 $('.li_link').live('click', function() {...});

The use of a class would seem appropriate here. Create a new class say 'li_link' and add it to the li elements that you want to link to. Then apply your click handler to all li elments with the class, eg.

$('.li_link').click(function() {...});

If you want to change the li elements that are handled dynamically, you could consider using live events. This allows you to add and remove the 'li_link' class from li elements and the click handler will apply or stop being applied to the li elements automatically.

To set up a live event use something like this:

 $('.li_link').live('click', function() {...});

回复收藏 0 原文

So要识趣 2024-10-23 03:05:12

$("#id").find("a").not("#dont-want-01 a, #dont-want-02 a").click(function(){   

});

$("#id").find("a").not("#dont-want-01 a, #dont-want-02 a").click(function(){   

});

回复收藏 0 原文

就是爱搞怪 2024-10-23 03:05:12

实际上没有办法用 HTML 来做到这一点，但如果你实现了一个 rel attr 或类，你可以相当容易地选择它。

   <nav id="id">    
  <ul>
    <li id="want-01" rel="wanted"><a href="#">link</a></li>
    <li id="want-02" rel="wanted"><a href="#">link</a></li>
    <li id="want-03" rel="wanted"><a href="#">link</a></li>
    <li id="dont-want-01"><a href="#">link</a></li>
    <li id="dont-want-02"><a href="#">link</a></li>
    <li id="want-04" rel="wanted"> <a href="#">link</a></li>
    <li id="want-05" rel="wanted"><a href="#">link</a></li>
  </ul>       
</nav>

$("#id").find('li[rel=wanted]').children();

Theres' really no way to do it with that HTML, but if you implmented a rel attr or class you can select it fairly easily.

   <nav id="id">    
  <ul>
    <li id="want-01" rel="wanted"><a href="#">link</a></li>
    <li id="want-02" rel="wanted"><a href="#">link</a></li>
    <li id="want-03" rel="wanted"><a href="#">link</a></li>
    <li id="dont-want-01"><a href="#">link</a></li>
    <li id="dont-want-02"><a href="#">link</a></li>
    <li id="want-04" rel="wanted"> <a href="#">link</a></li>
    <li id="want-05" rel="wanted"><a href="#">link</a></li>
  </ul>       
</nav>

$("#id").find('li[rel=wanted]').children();

回复收藏 0 原文

~没有更多了~