对元素属性的jquery操作

Var*_*rma 1 html javascript jquery dom

所以问题就像:我用json生成一个html块,最终的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 ....
...
...
Run Code Online (Sandbox Code Playgroud)

所以我在"section"标签中设置"img-width"属性,用于指定其中的图像宽度.

我想做的事 ?我只想用class = imagesec隐藏所有部分,这可以这样做

$("section.imagesec").hide()
Run Code Online (Sandbox Code Playgroud)

然后显示包含宽度高于350像素的图像的所有部分.所以这样做的一种方法就是让所有的section元素循环遍历每个元素并获取属性"img-width"的值并将其与350进行比较,如果它超过那个显示当前的html对象,否则隐藏它.

但我想要的是这样的东西可以在jquery ???

$("section.imagesec").hide()
$("section.imagesec").having(attr(img-width) > 350).show()
Run Code Online (Sandbox Code Playgroud)

简而言之:我只想隐藏包含宽度小于350像素的图像的所有部分.

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

Raj*_*amy 5

尝试使用.filter()call back来完成你的任务,

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

DEMO

  • @ಠ_ಠ没关系 - `parseInt()`忽略字符串末尾的非数字 (2认同)