关于JQuery：Contents of an H3 as the H3’s ID


Contents of an H3 as the H3's ID

我需要获取EDOCX1的内容(0)，然后将内容小写并删除空格(用-或-替换)，然后将它们注入EDOCX1的ID(0)。

例如…

1
2
3
4
<li class="widget-first-list">About This Stuff
</li>

<li class="widget-first-list"><h3 id="about-this-stuff">About This Stuff

这应该存在于页面上的H3s负载中，因此它需要在某个地方包含"$this"。

希望这是有意义的-我同意jquery，但这给我带来了一些问题。

相关讨论

既然您指定了jquery，那么现在可以开始：

1
2
3
4
$("h3").each(function() {
    var me = $(this);
    me.attr("id",me.text().toLowerCase().replace(/[^a-z0-9-]/g,'-').replace(/--+/g,'-'));
});

这将用-替换所有非字母数字字符，然后去掉多个连续的-字符。

在普通JS中(效率更高)：

1
2
3
4
5
6
(function() {
    var tags = document.getElementsByTagName("h3"), l = tags.length, i;
    for( i=0; i<l; i++) {
        tags[i].id = tags[i].firstChild.nodeValue.toLowerCase().replace(/[^a-z0-9-]/g,'-').replace(/--+/g,'-');
    }
})();

更好的是，检查重复项：

1
2
3
4
5
6
7
8
9
10
11
12
13
(function() {
    var tags = document.getElementsByTagName("h3"), l = tags.length, i, newid, n;
    for( i=0; i<l; i++) {
        newid = tags[i].firstChild.nodeValue.toLowerCase().replace(/[^a-z0-9-]/g,'-').replace(/--+/g,'-');
        if( document.getElementById(newid)) {
            n = 1;
            do {n++;}
            while(document.getElementById(newid+'-'+n));
            newid += '-'+n;
        }
        tags[i].id = newid;
    }
})();
相关讨论

解决方案：

1
2
3
4
5
6
$("h3").each(function() {

    var content = $(this).html().replace(/ /g,'_').toLowerCase();
    $(this).attr("id",content);

});
相关讨论