JQuery：如果元素含有文本，则添加类

Question

我有一系列链接在ul中。其中有些有文本，有些没有，例如：

<ul>
<li><a href="google.com">Google</a></li>
<li><a href="yahoo.com">Yahoo</a></li>
<li><a href="bing.com">Bing</a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
<li><a href="#"></a></li>
</ul>

我希望使用JQuery仅对包含文本的a标签应用类。

目前我的代码如下：

var buttontext =  $('ul a').text();

if (buttontext.length > 0){
$('ul a').addClass('buttoneffect');
}

但是这个类仍然影响所有的a标签。我想知道是否有人可以指导我正确的方向？

谢谢

- MeltingDog

---

你能否只是警告buttontext和检查的值？ - Mahesh KP

Answer 1

当我写这段代码时，它似乎是最简单的：

$('a').filter(
    function(){
        var child = this.firstChild;
        if (child){
            return child.nodeType == 3 && child.nodeValue.length;
        }
    }).addClass('buttoneffect');​​

JS Fiddle演示。

或者使用纯JavaScript：

var aElems = document.getElementsByTagName('a');

for (var i=0,len=aElems.length; i<len; i++){
    var child = aElems[i].firstChild;
    if (child && child.nodeType == 3 && child.nodeValue.length >= 1) {
        aElems[i].className += ' buttoneffect';
    }
}​

JS Fiddle演示。

- David Thomas

Answer 2

试试这个

$('ul a').each(function()
               {                                        
                  if($(this).text()!='')    
                  {
                     $(this).addClass('buttoneffect');   
                  }
               });

请检查http://jsfiddle.net/uawBL/11/

- Mahesh KP

Answer 3

$("ul a").each(function (i, e) {
    var $e = $(e);
    if ($e.text().length > 0) {
        $e.addClass("buttoneffect");
    }
});

- Ned Batchelder

---

谢谢。只是好奇那个函数中的 i 是否自动递增或者有其他用途？ - MeltingDog

@MeltingDog：你可能想熟悉一下jQuery文档：是的，i参数是选择器在列表中找到的元素的索引。 - Ned Batchelder