Question

我经常通过JavaScript隐藏/显示节点，但现在我需要在显示时设置特定类inline-block（不是block）的节点。但是，我在排序inline-block类时遇到问题，其余的class在此上下文中为空：

show: function (div) {
    if (typeof div === 'object' && typeof div.style === 'object') {
        if (div.class == "inline-block-class") //this doesn't work
        {
            div.style.display = "inline-block";
        } else {
            div.style.display = "block";
        }
    }
}

div引用data-dojo-attach-point - 我可以完全使用this.someAttachPoint之类的内容，但是当我将其包装到其他变量（例如div中）时我的函数），我只获得节点的CSS选择器 - 它是一个对象，但我无法在FireBug中获取它的属性。

我可以通过添加另一个参数来解决这个问题，一个标志告诉我这个节点应该是inline-block，但它很脏并且有另一个错误的机会，所以我更愿意做block / { {1}}功能区别。

Answer 1

使用dojo/dom-class和dojo/dom-style模块检查DOM节点上的类并更改样式。

show: function (div) {
if (typeof div === 'object' && typeof div.style === 'object') {
    if (domClass.contains(div, "inline-block-class"))
    {
        domStyle.set(div, 'display', 'inline-block');
    } else {
        domStyle.set(div, 'display', 'block');
    }
}
}

更好的解决方案是使用CSS而不是Javascript来控制div.style.display。只需更改Javascript中的类，让CSS处理样式。

Answer 2

您可以使用DOM元素div的{{3}}属性，它公开了一个方法contains。

检查元素的class属性中是否存在指定的类值。

if (div.classList.contains("inline-block-class")) 
{
    div.style.display = "inline-block";
} else {
    div.style.display = "block";
}

如何检查节点是否在Dojo中具有特定类？

2 个答案: