JavaScript在HTML文档中获取h1元素并更新唯一ID

Question

我有一个遗留的html文档,其中包含没有id的h1元素.我想要实现的是能够使用JavaScript获取所有h1(s),然后向每个h1(s)添加一个唯一ID.

我搜索过但找不到有效的解决方案.

Answer 1

尝试使用它们document.getElementsByTagName("h1").循环遍历它们,检查它们是否有id,并正常工作.尝试:

var h1s = document.getElementsByTagName("h1");
for (var i = 0; i < h1s.length; i++) {
    var h1 = h1s[i];
    if (!h1.id) {
        h1.id = "h1" + i + (new Date().getTime());
    }
}

演示: http ://jsfiddle.net/kTvA2/

运行演示后,如果你检查DOM,你会发现4个h1元素中有3个有一个新的,唯一的id.与一个id摆在首位没有改变.

请注意,此代码需要在所有元素准备好/呈现后运行,这可以通过将代码放在window.onload处理程序中来实现.提供的演示设置为隐式运行代码.

更新:

使用jQuery,您可以使用:

$(document).ready(function () {
    $("h1:not([id])").attr("id", function (i, attr) {
        return "h1" + i + (new Date().getTime());
    });
});

演示: http ://jsfiddle.net/kTvA2/7/