Javascript 如何仅显示与哪个动态属性匹配的div

我可能很接近，但显然没有人问这样的问题，也许我会用错误的措辞问

我有一个标签，其类别是动态的，而奇特的盒子厨房也有动态属性（这里显示为带有属性lala=“xyz”的div）。那么，我如何才能在点击选项卡（这里是第一个和最后一个按钮）时只显示匹配的Gallery（在我的代码中，前两个或最后两个div应该是一致的）

注意：属性是不可预测的

我的html：

<div class="wrap">
<div class="box" lala="ui">
  <p>This is my box. There are many like it, but this one is mine. 1</p>
</div>

<div class="box" lala="ui">
  <p>This is my box. There are many like it, but this one is mine. 2</p>
</div>

<div class="box" lala="uibui">
  <p>This is my box. There are many like it, but this one is mine. 3</p>
</div>

<div class="box" lala="uibui">
  <p>This is my box. There are many like it, but this one is mine. 4</p>
</div>
</div>

<div class="showall">Show all</div>
<br>
<div class="mybutton" lala="ui">SHOW ONLY UI</div>
<div class="mybutton" lala="uibui">SHOW ONLY UIBUI</div>

---

提前谢谢

将属性注入属性选择器，以便最终结果如下所示

not（'[lala=“uibui”]'）

e、 g

JSFiddle：

它可以简化为

$('.mybutton').click(function () {
    var myattr = $(this).attr('lala');
    $('.box:not([lala="' + myattr + '"])').hide();
});

JSFiddle：

甚至可以归结到这一点（但现在可读性较差）：

试试这个：

$(".box").not('[lala = "'+myattr+'"]').hide();

---

作品非常感谢。：）答案有效，只是添加了一行代码来再次显示隐藏的div:$（'.mybutton'）。单击（函数（）{$（'.box'）.show（）；var myattr=$（this.attr（'lala'）；$（'.box:not（[lala=“'+myattr+'”）.hide（）；）；

$('.mybutton').click(function () {
    var myattr = $(this).attr('lala');
    $('.box:not([lala="' + myattr + '"])').hide();
});

$('.mybutton').click(function () {
    $('.box:not([lala="' + $(this).attr('lala') + '"])').hide();
});

$(".box").not('[lala = "'+myattr+'"]').hide();