indexOf在这种特殊情况下匹配变量

Question

我想检查mydiv是否有类，如果没有类，请添加 var newClass。我试图这样做，但它不起作用：

var newClass="classToBeAdded";

if(document.getElementById("mydiv").className.indexOf(/(?:^| )(newClass)(?:$| )/)==-1){
    document.getElementById("mydiv").className+=" "+newClass;
}

Answer 1

使用此：

var newClass = "classToBeAdded";
var d = document.getElementById("mydiv");
var r = new RegExp(" " + newClass + " ");
if (r.test(" " + d.className + " "))
    // do something here

或者，类似地：

var d = document.getElementById("mydiv");
if ((" " + d.className + " ").indexOf(" " + newClass + " ") != -1)
    // do something here

在className字符串之前和之后添加空格，这样我们就可以匹配目标类，无论它出现在字符串中的哪个位置。

一些测试

假设以下功能：

function hasClass(str, name) {
    return (" " + str + " ").indexOf(" " + name + " ") != -1;
}

试验：

hasClass("target", "target") // true
hasClass("test target test1", "target") // true
hasClass("test1 target", "target") // true
hasClass("target test1", "target") // true
hasClass("test1", "target") // false

Answer 2

您可以使用dom元素的javascript属性

document.getElementById("mydiv").classList

返回已分配的类名称数组

Answer 3

您应该使用库来为您抽象出这类问题。

根据经验，你应该专注于你的领域特定问题，而不是重新发明轮子。

jQuery .hassClass是一个很好的候选人