1

学习 DOM0 javascript,教授抛出了一个曲线球。他用班级名称写了几十个段落:体育、生活、书籍、喜剧,然后是:

<p class="sports books comedy">
    I found this book: http://www.amazon.com/Teed-Off-Laughs-Greens-Sports/dp/0233995005/ref=sr_1_1?ie=UTF8&s=books&qid=1277749796&sr=1-1 You don't have to be good to play, but a low level of self-esteem is helpful! Humorous collection of colour photographs and hilarious text reduces our heroes of the golf course to mere mortals. No golfing disaster is left secret and the 80 photographs only go to prove the fallibility of international stars.
</p>

必须在不使用 Jquery 的情况下对其进行样式设置,我的想法是:

window.onload=function(){
    var elements = document.getElementsByTagName('*');
    for (var i=0; i<elements.length; i++) {
        if (elements[i].className == 'sports') {
            elements[i].style.border="2px solid green";
        }

        else if (elements[i].className == 'life') {
            elements[i].style.color="red";
        }

        else if (elements[i].className=="books") {
            elements[i].style.textAlign="right";
        }

        else if (elements[i].className=="comedy") {
            elements[i].style.fontSize="200%";
        }
    }
}

它适用于除多个类名之外的所有内容。试图找到解决它的方法。

4

2 回答 2

4
elements[i].className.indexOf('sports') >= 0

如果任何类是运动类,它将起作用,尽管它也会增加子字符串的问题(也将匹配“othersports”)

所以大概

var classlist;
classlist = elements[i].className.split(/\s+/);
if(classlist.indexOf('sports') >= 0)

那有点冗长,但应该适合您想要做的事情。

于 2013-04-01T01:53:12.360 回答
2
elements[i].classList.contains('sports')

ben336的答案也有效,并且曾经是最好的方法,但是现在有一种本地方法可以做到这一点,我们应该更喜欢它(因为它更快,代码更少)。唯一的缺点是它不能在没有 polyfill 的 IE8 或 IE9 中工作。

于 2013-04-01T02:26:01.263 回答