javascript - 对元素属性的 jquery 操作

Question

所以问题是这样的:我正在生成一个带有 json 的 html block ，最终的 html 看起来像这样:

<section class="imagesec" img-width="400">
    <button>click me</button>
    <img src="xyx.jpg"> <!-- image actual width = 400px -->
    <hr>
</section>
<section class="imagesec" img-width="300">
    <button>click me</button>
    <img src="abc.jpg"> <!-- image actual width = 300px -->
    <hr>
</section>

and so it goes on ....
...
...

所以我在“section”标签中设置“img-width”属性来指定其中图像的宽度。

我想做什么？我只想隐藏所有带有 class = imagesec 的部分，可以这样做

$("section.imagesec").hide()

然后显示所有包含宽度大于 350 px 的图像的部分。因此，一种方法是获取所有部分元素，然后遍历每个元素并获取属性“img-width”的值并将其与 350 进行比较，如果它超过显示当前 html 对象，否则隐藏它。

但我想在 jquery 中可以实现这样的功能吗？？？

$("section.imagesec").hide()
$("section.imagesec").having(attr(img-width) > 350).show()

IN SHORT : I just want to hide all sections which contain images with width less than 350px .

编辑:img-width="400"不是 img-width="400px"

Answer 1

尝试使用 .filter() 及其 call back 来完成您的任务，

$('section.imagesec[img-width]').filter(function(){
  return (parseInt($(this).attr('img-width'),10) < 350);
}).hide();

DEMO