如何添加類到元素只有它已經沒有它？

Question

如何將元素添加到元素只有當它已經沒有它？假設我們不知道元素是否有class="desired_class ...，但我們想讓它舒服一些。

Answer 1

試試這個

var elem = $('selector'); 
if(!elem.hasClass('desired_class')){ 
    elem.addClass('desired_class'); 
} 

Answer 2

if ($('element').hasClass('some_class')) { 
    $('element').addClass('class_name'); 
} 

Answer 3

你確定你想只用jQuery來做到這一點？你可以用簡單的JavaScript來做到這一點。

document.getElementById("elementId").getAttribute("class") 

如果class屬性不存在，會給你null。

Answer 4

 

if (!$("your_element").hasClass("desired_class")) { 
    $("your_element").addClass("desired_class"); 
} 
 

Answer 5

此外，您還可以使用classList屬性和它的add()方法：

var element = document.getElementById('myElement'); 
element.classList.add('myClass'); 

如果元素沒有它的類名稱將只增加。

更多classList： https://developer.mozilla.org/en-US/docs/Web/API/Element/classList

Answer 6

我寫檢查，如果類將它添加到元素之前存在JavaScript的唯一功能。通過使用下面的代碼（您可以隨時使用classList這裏提到的，但這種支持與IE10開始。）

function addClass(name, element) { 
 
    var classesString; 
 
    classesString = element.className || ""; 
 
    if (classesString.indexOf(name) === -1) { 
 
    element.className += " " + name; 
 
    } 
 
} 
 

 
var element = document.getElementById('some-element'); 
 

 
addClass("on", element); // Adds the class 'on' 
 
addClass("on", element); // Ignored 
 
addClass("on", element); // Ignored 
 

 
document.write('Element classes: ' + element.className);

<div id="some-element"></div>

Answer 7

在普通的JavaScript檢查類別的存在。在這裏，我檢查EL（元素）具有tempClass或不

var el = document.getElementById("div1"); 

... 

if (el.classList.contains("tempClass")){ 
    return true; 
}