如何檢查節點在Dojo中是否具有特定的類？

Question

我經常通過JavaScript隱藏/顯示節點，但是現在我需要在顯示時設置特定類的inline-block （而不是block ）。 但是，我在inline-block類和其余部分進行排序時遇到問題， class在這種情況下為null：

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 / inline-block區分。

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 Element.classList屬性，它公開了一個contains的方法。

檢查元素的class屬性中是否存在指定的class值。

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