Question

我正在尝试选择所有具有类的元素，获取其ID（如果有的话），并根据该信息将单个跨度附加到文档的末尾。这是我设法得到的：

var element = $(".foo"),
    element_id = element.attr("id"),
    span_id = "for-" + element + "-id-" + element_id,   
    ;

我希望为每个收集的元素添加一个span。以下是我希望实现的span格式的一些示例：

<span id="for-img-id-profile"></span>
<span id="for-div-id-content"></span>

如果可能的话，我还想允许没有ID的元素被格式化为：

<span id="for-h1"></span>

我非常感谢帮助，因为我对jQuery很新，并且正在努力学习。

Answer 1

像

这样的东西

$(".foo").each(function(index){
    var id = "";
    if($(this).attr("id") !== "")
    {
        id = "for-" + $(this).attr("id"); 
    }
    else
    {
       id = "for-h" + index;
    }

    $("<span />").attr("id", id).after("#content");
});

<强> 注意

您必须确保文档中的ID应该是唯一的，并且没有两个元素具有相同的ID。

Answer 2

我并不完全确定你希望完成什么，但你会想要一些看起来更像这样的东西：

$('.foo').each(function()
{
    var $this = $(this);
    $('<span id="for-' + ($this.attr('id') || $this.get(0).tagName) +
       '"></span>').appendTo($(document));
});

Answer 3

这样做也很快，因为最好一次将所有跨度作为一个块插入。

//get .foo elements
var eles = $('.foo').toArray(), spans = [];
//create html-fragments for each found element
//respecting if no id is found
//no overhead in loop as no unneeded jQuery wrapping is used
for(var i=0; i < eles.length; i++) {
    var e = eles[i],
        tmp = '<span id="for-'+e.tagName.toLowerCase();
    if(e.id) {
        tmp += '-id-' + e.id;
    }
    tmp += '"/>';
    //collect html fragments in an array
    spans.push(tmp);
}
//join the html-fragments with "no-space" and insert after div#content
$("#content").after(spans.join(""));

检查http://jsbin.com/etafe是否有演示

Jquery - 以跨度附加所选项目

3 个答案: