Question

我有很多html页面使用旧的嵌套列表无法正常工作。我想动态查看页面是否使用它并添加类属性或建议更好的方法来执行此操作。

动态更新所有出现的

<ol type="a"> to <ol class="alpha">

或者建议我是否仍然可以使用类型但使用嵌入式CSS应用样式？

Answer 1

如果你想用JavaScript做到这一点，使用jQuery很容易：

$(document).ready(function(e) {
    $('ol[type="a"]').addClass("alpha").removeAttr("type");
});

这将改变＆lt; ol type =“a”＆gt;到＆lt; ol class =“alpha”＆gt;，通过选择带有type =“a”的ol，然后添加alpha类，然后删除type属性。

Answer 2

不使用JavaScript，您可以使用CSS属性选择器：

ol[type=a] {
    color: red;
}

JS Fiddle demo

重要的是要注意，这也可能“无法正常工作”（我在第一次阅读你的问题时错过的一句话），取决于“不工作”的表现方式，或者不起作用的方式。< / p>

如果您认为必须使用JavaScript，则以下方法有效：

var ols = document.getElementsByTagName('ol');

for (var i=0, len=ols.length; i<len; i++){
    ols[i].className = ols[i].type == 'a' ? 'alpha' : '';
}

JS Fiddle demo

如果要在设置类后删除type属性：

var ols = document.getElementsByTagName('ol');

for (var i=0, len=ols.length; i<len; i++){
    if (ols[i].type == 'a') {
        ols[i].className = 'alpha';
        ols[i].removeAttribute('type');
    }        
}

JS Fiddle demo

动态更新<ol type =“a”>的所有属性为<ol class =“alpha”> </ol> </ol>

2 个答案: