修改A元素，但仅当它包含在特定范围 ID 内时

Question

我有以下 jQuery 小技巧，可以使 Warning 中显示的任何 HTML 显示为大而红色：

$("strong:contains('Warning')").css("color","red").css("font-size","400%");

它工作得很漂亮。但是，它会使所有内容变大且呈红色，而且我真的只希望它使警告也变大并呈红色（如果它们也出现在 ID 为 myWarning 的跨度中）。例如：

<span id="myWarning">
  <div align="left" class="tip">
    <strong>Warning</strong> (I want this to be big and red...)
  </div>
</span>

<strong>Warning</strong> (...but I don't want this to be big and red)

我怎样才能增强我的 jQuery hack 让它只修改第一个“警告”的 CSS 而不是第二个？

Answer 1

只需在选择器前面添加一个 #myWarning 即可？

$("#myWarning strong:contains('Warning')").css("color","red").css("font-size","400%");

Answer 2

$("#myWarning strong").css("color":"red", "font-size":"400%");

Answer 3

我想你希望第一个这样的警告是大的和红色的？

$("strong:contains('Warning')").first().css("color","red").css("font-size","400%");

Answer 4

你为什么使用 jQuery 来实现这个目的？为什么不简单地使用 CSS：

#myWarning strong { color: red; font-size: 400%; }