javascript - 李:odd li:even not working

Question

我的 WordPress 主题中有这段代码:

<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/jquery.latest.js"></script>

<script type="text/javascript">
        $(document).ready(function() {
            $ ('ul li:even').addClass('even');
            $ ('ul li:odd').addClass('odd');
        });
</script>

以及正文部分

<div id="specs">
<ul>
<li><strong>Standby Time</strong> 1100hr</li>
<li><strong>Internal Storage</strong> 16GB or 32GBGB</li>
<li><strong>Memory Slot</strong> microSD up to 32GB</li>
<li><strong>Camera</strong> 8 Megapixel</li>
<li><strong>Front Facing Camera</strong> 2 Megapixel</li>
<li><strong>Video Camera</strong> Yes, 1080p</li>
<li><strong>Camera Flash</strong> 1 x LED</li>
<li><strong>Coverage (Band)</strong> Quad</li>
</ul>
</div>

jQuery 似乎不应用奇数类和偶数类。尝试了不同版本的 jQuery 但仍然一无所获。有人可以帮我解决这个问题吗？

Answer 1

这应该可以正常工作，但我们也可以尝试稍微重写它，以根据以下内容使用 :even 和 :odd 选择器的最佳实践jQuery 文档:

Additional Notes:

Because :even is a jQuery extension and not part of the CSS specification, queries using :even cannot take advantage of the performance boost provided by the native DOM querySelectorAll() method. To achieve the best performance when using :even to select elements, first select the elements using a pure CSS selector, then use .filter(":even").

$(document).ready(function() {

    $('ul li').filter(':even').addClass('even').end()
              .filter(':odd').addClass('odd');
});

list :

1. jQuery 是否已加载？ (检查 Firebug/Chrome 中的网络监视器)
2. 第一个选择器中是否需要 ul 过滤器？仅选择 li 的性能会更高，因为 jQuery 可以利用 getElementsByTagName。