jquery - 如何为通过 contains() 搜索的文本添加下划线

Question

<div>John Resig</div>
<div>George Martin</div>
<div>Malcom John Sinclair</div>
<div>J. Ohn</div>
<script>
$("div:contains('John')").css("text-decoration", "underline");
</script>

上面的代码将为包含“John”的总DIV添加下划线。但是我怎样才能只让“John”带有下划线。
请有人帮助我。

Answer 1

您必须将文本包裹在一个跨度中:

$("div:contains('John')").each(function()
{
    var $el = $(this);
    $el.html( $el.html().replace(/John/g, '<span style="text-decoration: underline">John</span>') );
});

http://jsfiddle.net/GP96T/2/

正如 @Brad Christie 所指出的，只有当您知道属性中没有“John”，或者 div 没有子项时，才应该使用此选项。