javascript - 使用 jquery 查找 p 内具有特定类的图像标签

Question

我有多个<p>我的页面上的元素。这个数据<p>元素来自数据库。

这是我的代码。 第一种<p>元素

<p><img class="img img-responsive" src="image_url" alt="" width="235" height="41"></p>

第二种类型<p>元素为 style属性(此样式也来自数据库)

<p style="text-align: center;">
       <img class="img img-responsive" src="image_url" alt="" width="235" height="41">
</p>

现在我想添加class center-block到图像，其 <p>标签有这样的样式属性。

<p style="text-align: center;>

我正在使用以下 jquery 代码执行此操作。

<script>
    $( "p" ).find( "img" ).addClass('center-block');
</script>

问题

但问题是那个类 center-block应用于两个图像。我只想将此应用于第二种类型 <p> 中的图像元素。 我该怎么做？

Answer 1

仅检索属性中具有该样式的段落(以 text-align 开头)

$( "p[style^='text-align'] img" ).addClass('center-block');

---

在 VanillaJS 中:

[].forEach.call(document.querySelectorAll("p[style^='text-align'] img"), function(el) {
    el.classList.add('center-block');
})

Demo