IE9及更早版本中不支持classList.contains（'outputDiv'），

Question

classList.contains('outputDiv') not supported in IE 9 and older, is there any alternative for that?

My code is as below:

function toggleclass() {

    var elems = document.getElementsByClassName("outputDivs");
    for (var i = 0; i < elems.length; ++i) {
        if (elems[i].classList.contains("outputDivsDesigned"))
            elems[i].className = "outputDivs";

        else
            elems[i].className += " outputDivsDesigned";
    }
}

Thanks for any help.

Answer 1

You can try this https://github.com/eligrey/classList.js

or just use className, and search the returned string.

Answer 2

I just wrote this, perhaps it might be helpful?

http://www.tjcafferkey.me/ie9-classname-containsclass-alternative/

It basically explains this simple alternative you could use:

function containsClass(yourObj, yourClass) {
    if(!yourObj || typeof yourClass !== 'string') {
        return false;
    } else if(yourObj.className && yourObj.className.trim().split(/\s+/gi).indexOf(yourClass) > -1) {
        return true;
    } else {
        return false;
    }
}

You would then run the function like this

var isFeaturedPost = containsClass(obj, 'featured-post-class');

Edit: I've updated the function to check yourObj exists, and that yourClass is a string.

Answer 3

不确定它是否会起作用，因为没有测试过为crossbrowser工作，你可以尝试： -

  classList.indexOf("outputDivsDesigned") != -1

Answer 4

If all you need is .contains() functionality, search for the substring inside of the className , ie elems[i].className.indexOf("outputDivsDesigned") > -1 .

So your function would look like this:

function toggleclass() {    
    var elems = document.getElementsByClassName("outputDivs");
    for (var i = 0; i < elems.length; ++i) {
        if (elems[i].className.indexOf("outputDivsDesigned") > -1)
            elems[i].className = "outputDivs";    
        else
            elems[i].className += " outputDivsDesigned";
    }
}