jQuery选择器，通过锚ID概括选择器

我的网站上有一些代码，可以在博客上显示文章列表，如下所示（将有多个对象具有相同的类别）：

当您点击相关链接时，即

<a id="showall">All</a>
<a id="category1">Category 1</a>

全部
第一类

目前，我要处理9个类别和10个jQuery片段，这些片段似乎效率极低（效率极低）。我不知道如何对代码进行泛化，以便它接受锚的ID（或者类），然后将其应用于相关列表。需要帮忙吗

谢谢

---

事件的处理函数被传递给事件对象（触发事件的元素也作为

this

传递）。您可以使用它来获取id，然后从那里进行操作-如果有必要，可以使用jQuery库中的DOM遍历函数来找到正确的列表。

试试这个（未经测试，但应该会让您有所了解）：

---

您可以通过从类别列表中执行操作来实现代码的公共化：

$("#showall").click(function() {
    $("ul.article").show('fast');
});

var cats = "food cars books";
$.each(cats.split(" "),
    function(cat) {
        $("#show"+cat).click(function() {
            $("ul.article."+cat).show('fast');
            $("ul.article").not("ul."+cat).hide('fast');
        });
    });

---

这不会改变运行时行为，只是减少了创建函数所需的代码量。这里的关键思想是，jQuery选择器不必是文字字符串，它们可以由文字和变量构成。

您可以使用

$（“.class”）。单击
isntead of
$（“#showcategory1”）。单击触发器的
，使用id选择特定的项目，并使用
.sibles.hide（）
隐藏所有其他文章。
他没有试图单击文章，而是有单独的链接控制要显示的文章。如果使用
.sides
，可以将最后两行链接在一起，成为
$（“ul.article.+cat”）.show（'fast'）.sides（）.hide（'fast'）谢谢，太棒了：）请注意。每个（cats.split（“”，function（cat））都应该更改为.each（cats.split（“”，function（i，cat）），以使此工作正常。
<a id="showall">All</a>
<a id="category1">Category 1</a>

$("a[id^=category]").click(function() {
    $("ul." + $(this).attr("id")).show("fast").siblings().hide("fast");
});

$("#showall").click(function() {
    $("ul.article").show('fast');
});

var cats = "food cars books";
$.each(cats.split(" "),
    function(cat) {
        $("#show"+cat).click(function() {
            $("ul.article."+cat).show('fast');
            $("ul.article").not("ul."+cat).hide('fast');
        });
    });