javascript - jQuery 属性选择器问题

Question

我对 jQuery 属性选择器有疑问，我不明白为什么“Div 1”在此示例中的背景颜色为绿色。

$(document).ready(function() {
  $('div[title],[style]').css('border', '5px solid red');
  $('[title][style]').css('background-color', 'green');
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div title="div1Title">
  Div 1
</div>
<p title="p1Title">
  Paragraph 1
</p>
<div style="background-color:yellow">
  Div 2
</div>
<p title="p2Title" style="background-color:yellow">
  Paragraph 2
</p>

Answer 1

因为你的第一行导致 style 属性添加到你的 div1，这一行

$('div[title],[style]').css('border', '5px solid red');

因此您的 div1 现在具有 title 以及 style 属性，所以下一行 this

$('[title][style]').css('background-color', 'green');

适用于它。

如果你不想给你的第一个 div 应用背景颜色，只需切换你的行的顺序