添加元素中包含的内容以及数组

时间:2012-02-07 11:23:07

标签: javascript jquery html arrays

我正在尝试添加每个span的内容以及title属性中的值。

<div id="group-wrap" class="group">
    <span class="lbracket" title="&f">(</span>
    <span class="grouptitle" title="&f"> Group </span>
    <span class="rbracket" title="&f">) </span>
    <span class="username" title="&f"> Username </span>
    <span class="col" title="&f">:</span>
    <span class="text" title="&f"> Helo There! </span>
</div>

这是我到目前为止所做的:

var str = [];
    $('#group-wrap span').each(function(){
        str.push($(this).attr('title'));
    });
    alert(str.join(''));
});

http://jsfiddle.net/B9QeK/3/

输出为&f&f&f&f&f(每个标题属性的值),但预期输出具有值,加上范围内的内容。应在内容之前附加属性的值。

&f(&fGroup&f)&fUsername: &f text

我怎样才能得到这个结果?

5 个答案:

答案 0 :(得分:2)

jQuery(function($){
    var str = [];
    $('#group-wrap span').each(function(){
        str.push($(this).attr('title') + $(this).text());
    });
    alert(str.join(''));
});

<强> Working JSFiddle

text

  

描述:获取匹配元素集合中每个元素的组合文本内容,包括它们的后代。

<强> docs

答案 1 :(得分:2)

看起来你正在寻找

str.push( this.getAttribute('title'), this.textContent || this.text );

至于性能原因,您不应该为每次迭代重新创建一个jQuery对象。更好的是,根本不使用jQuery来接收这些值。

JSFiddle

顺便说一下,你可以使用jQuerys .map()来做得更优雅:

jQuery(function($){
    var str = $('#group-wrap span').map(function(){
        return this.getAttribute('title') + this.textContent || this.text;
    }).get();

    alert(str.join(''));
});

JSFiddle

参考:.map()

答案 2 :(得分:1)

只需使用text方法获取每个span的文字内容:

var str = [];
    $('#group-wrap span').each(function(){
        //Push value of title attribute and text content into array:
        str.push($(this).attr('title') + $(this).text());
    });
    alert(str.join(''));
});

答案 3 :(得分:1)

你的行

str.push($(this).attr('title'));

应该是这样的:

str.push($(this).attr('title') + $(this).text());

虽然这是两个相同的调用$(this),所以你可以考虑缓存:

var $this = $(this)
str.push($this.attr('title') + $this.text());

答案 4 :(得分:1)

var str = "";
    $('#group-wrap span').each(function(){
        str+=$(this).attr('title')+$(this).text();
    });
    alert(str);
});