如何防止Cufón替换某个类下的元素中的文本?

时间:2011-06-09 19:25:26

标签: html css css-selectors cufon

我正在使用Cufón替换网页上的文字,我加载了jQuery库。我正在尝试替换<li>元素的所有实例(包括<p>等等),但仅当它们出现在某个类下时。< / p>

以下是一些示例HTML:

<ul>
   <li>This</li>
   <li>Should</li>
   <li>Be Replaced</li>
</ul>
<div>
  <ul>
    <li>So should</li>
    <li>this</li>
  </ul>
</div>
<div class='no-cufon'>
   <ul>
      <li>Don't replace this</li>
   </ul>
</div>

请注意,我的大部分HTML都是动态的 - 否则我会继续更改标记。

我正在使用命令Cufon.replace('*:not(.no-cufon) li');替换文字,但它仍定位所有 <li>标记

在我的开发人员控制台(Chrome 12)中,我使用这些jQuery选择器获得以下值:

$("body *").length
11
$("body *:not(.no-cufon)").length
10
$("body * li").length
6
$("body *:not(.no-cufon) li").length
6

由于某些原因,<li>类下的no-cufon标记仍然在我的最终jQuery选择器中匹配。

所以,如果这不起作用 - 会是什么?

2 个答案:

答案 0 :(得分:1)

body :not(.no-cufon) lili匹配body .no-cufon ul li,因为ul本身是:not(.no-cufon)

请改为尝试:

Cufon.replace('body > :not(.no-cufon) > li, body > :not(.no-cufon) > ul > li');

答案 1 :(得分:1)

filter()怎么样?使用以下选项,它会选择所有没有li父项的no-cufon元素。

Cufon.replace($('li').filter(function(){
    if ($(this).parents('.no-cufon').length == 0) return true;
}));

例如: http://jsfiddle.net/niklasvh/prr4W/