Question

我很确定我有这个权利，但尝试在我的javascript代码中使用两个单独的方法添加和删除。

第一个，是专门尝试将classStr添加到el的HTML元素对象className。如果它已经包含classStr，则它将保持不变。

var addClass = function addClass(el, classStr) {
    if(el.className !== classStr) {
        el.className = classStr;
    }
};

这一个，我只想从classStr删除className而不留任何空格。 el是一个元素对象。我唯一不确定的是，如果我要离开白色空间。

var removeClasfunction = function removeClass(el, classStr) {
    delete el.className;
};

Answer 1

您的函数的主要缺点是它们不处理对象上的多个类名。另外，你真的不想删除属性名称，只是在没有类名时将其设置为空字符串。

这是一组用于管理类名的实用程序函数，当一个对象上有多个类名时，这些函数是你应该计划的（你不应该这样做）。这些不会累积任何额外的空格：

function addClass(elem, cls) {
    if (!hasClass(elem, cls)) {
        var oldCls = elem.className;
        if (oldCls) {
            oldCls += " ";
        }
        elem.className = oldCls + cls;
    }
}

function removeClass(elem, cls) {
    var str = " " + elem.className + " ";
    elem.className = str.replace(" " + cls + " ", " ").replace(/^\s+|\s+$/g, "");
}

function hasClass(elem, cls) {
    var str = " " + elem.className + " ";
    var testCls = " " + cls + " ";
    return(str.indexOf(testCls) !== -1) ;
}

function toggleClass(elem, cls) {
    if (hasClass(elem, cls)) {
        removeClass(elem, cls);
    } else {
        addClass(elem, cls);
    }
}

在javascript中添加和删除对象

1 个答案: