javascript - 扫描元素类的所有 HTML，然后在该类上运行 javascript？

Question

我正在尝试执行此过程:

1. 查找所有以“i18n_”开头的类
2. 捕获该类名，然后将该类的 .html 值设置为与该类同名的变量。

基本上我有一个从服务器获取的列表，其中包含所有字符串，以 i18n_ 开头。例如 i18n_t23 = "Back"之类的。我想乘坐 <span class="i18n_t23"></span>并将其值设置为变量 i18n_t23。

目前我有大量手工编码的 $("span.i18n_t189").html(i18n_t189);而且必须检查它们是否都在那里变得很累人。必须有一种方法让它自动执行此操作。

谢谢!

Answer 1

只需使用:

$('span[class^=i18n_]').text(
    function(){
        return this.className;
    });

值得注意的是，这会将元素的 text 设置为元素的类名； span 没有 value 属性，并且设置它的 html() 是不必要的(虽然在这种情况下它有几乎相同的结果).

顺便说一下，根据您的需要，您可以使用简单的 CSS 来模拟它(以支持“现代”浏览器):

span[class=^=i18n_]::before {
    content: attr(class);
}

处理多个类的方法:

$('span[class]').filter(
    function(i, e) {
        var el = $(e),
            classes = el.attr('class').split(/\s+/);
        for (var i = 0, len = classes.length; i < len; i++) {
            var assessed = classes[i].indexOf('i18n_');
            if (assessed === 0) {
                el.data('classMatch',classes[i]);
                return true;
            }
        }
    }).text(function(){ return $(this).data('classMatch'); });​

JS Fiddle demo .

还有一种处理查找的方法(使用返回的类名从对象中检索分配的值:

var lookup = {
    'i18n_something' : 'Something for the "something" suffixed class.',
    'i18n_somethingElse' : 'Something for the "somethingElse" version.',
    'i18n_AndSomethingElse' : 'And...well, you know the drill.'
};

$('span[class]').filter(
    function(i, e) {
        var el = $(e),
            classes = el.attr('class').split(/\s+/);
        for (var i = 0, len = classes.length; i < len; i++) {
            var assessed = classes[i].indexOf('i18n_');
            if (assessed === 0) {
                el.data('classMatch',classes[i]);
                return true;
            }
        }
    }).text(function(){ return lookup[$(this).data('classMatch')]; });​

JS Fiddle demo .