如何使用jQuery获取元素id的一部分？

Question

我该如何从id为"old-[id]"的span标签中获取“一些文本”并将其放入id为“new-[id]”的标签中？

<span id="old-1">Some text</span>
<span id="new-1"></span>
<span id="old-5">Some text</span>
<span id="new-5"></span>

我不知道如何在不使用substring()函数的情况下获取id的数字部分。 我认为应该使用exists来解决问题。 谢谢。

- vlad

---

为什么你不想使用 substring() 函数？ - elclanrs

我认为这会使得代码在未来修改HTML时变得不够灵活。 - vlad

Answer 1

由于你的问题并不十分清晰，我会给你提供一些不同的例子：

对于单个ID，你可以这样做：

$("#new-1").text($("#old-1").text());

如果您拥有一堆需要处理的连续ID，可以这样做：

for (var i = 1; i <= 5; i++) {
    $("#new-" + i).text($("#old-" + i).text());
}

如果这是HTML而不仅仅是文本，您可以在上面的代码中使用.html()代替.text()。

$("#new-1").html($("#old-1").html());

或者

for (var i = 1; i <= 5; i++) {
    $("#new-" + i).html($("#old-" + i).html());
}

如果您想找到所有以“old-”开头的ID对象，并处理它们，无论它们有多少个以及上面有什么数字，您可以这样做：

$('[id^="old-"]').each(function() {
    var newid = this.id.replace(/old/, "new");
    $("#" + newid).html($(this).html())
})

这将创建一个jQuery对象，该对象包含所有id以“old-”开头的对象，然后替换“old”以创建目标id值，并使用该值将HTML从源复制到目标。

如果您有一个在名为elem的变量中给定的对象，并且您想提取id值的仅数字部分，则可以使用正则表达式来匹配数字部分，如下所示：

var matches = elem.id.match(/\d+$/);
if (matches) {
    var numString = matches[0];
}

- jfriend00

---

感谢您详细的回复。倒数第二个示例是我需要的。同时，最后一个示例也很棒。 - vlad

这个 "$('[id^="old-"]')" 就是我需要循环遍历标签页的。谢谢！ - Andrejs

Answer 2

我相信您想要在不事先知道ID的情况下检索它，以便可以复制该元素的文本。

如果是这样，这个简短的jQuery函数将会做到。

$('span').each(function()
    {
        var idnum = $(this).attr('id').match(/[\d]/);
        $('#new-' + idnum).text($(this).text());
    }
);

我创建了一个 jsfiddle 以进行演示。 链接

- rockerest

Answer 3

如果您想要将所有旧的 old-n span 的内容复制到相应的 new-n span 中，那么可以使用以下代码实现：

$('span[id^="old-"]').each(function() {
   $('#new-' + this.id.split('-')[1]).html( $(this).html() );
});

演示：http://jsfiddle.net/nnnnnn/bcXFf/ （通常我会使用.substr()来做这个，因为你已经知道数字出现的字符串位置，但是由于你要求避免使用它，所以我使用了.split()。） ^=是"属性以...开始"选择器，因此上面的代码选择所有以"old-"开头的元素，然后对于每一个元素，它找到相应的"new-"元素并将内容复制到其中。

- nnnnnn

Answer 4

这是您要寻找的吗？

var id = 1;
$('#new-'+id).text($('#old-'+id).text());

- Andy

Answer 5

使用类似这样的代码

$(document).ready(function () {
    var el = $("#old-1");
    var oldId = el.attr('id').replace(/[A-Za-z$-]/g, "");
    $("#new-" + oldId).text(el.text());
});

- Evgeny Lukashevich

Answer 6

我会使用：

$(document).ready(function(){
    var spanText = $('#old-1').text();
    $('#old-1').text(null);
    $('#new-1').text(spanText);
});

这将从旧文本中获取文本并将其放入新文本中。 如果您必须对多个ID执行此操作，则只需编写循环来进行迭代，或使用$.each方法来遍历所有ID。

- iAmClownShoe

Answer 7

JavaScript 的 paseInt() 函数将仅返回混合字符串/整数变量的整数部分。如果您将 $('#old-1).attr('id') 的值存储在一个变量中，然后对其进行 parseInt，它应该只返回数字。

- itsmequinn