是否有設置使用jQuery

項目的類的jQuery之前，我會用類似下面的代碼來設置一個元素的類的首選方法：是否有設置使用jQuery

document.getElementById("MyElementID").className = 'MyClassName';

這有更換任何的預期行爲在那裏之前我的新類名MyClassName

在jQuery的等效似乎是：

$('#MyElementID').attr('class', 'MyClassName')

但是，我們也有內置類FUNC addClass()，removeClass()和toggleClass()。因此，要達到同樣的效果，我會說：

$('#MyElementID').removeClass().addClass('MyClassName');

顯然，第一個jQuery的例子更加簡潔，只需要一個函數調用（以attr，而不是addClass()和removeClass()）

我們能否也假定我不能使用prop作爲我正在使用的較早版本（當前不可更改）的版本。

那麼你會說什麼是首選的方法？第二個樣本是否給我提供了超過第一個樣本的東西？

非常感謝提前。

來源

2011-05-19 James Wiseman

檢查性能：http://jsperf.com/jquery-data-vs-jqueryselection-data/8 – diEcho 2011-05-19 07:44:01

jQuery的addClass（），removeClass（）和has（）方法使用元素的className屬性。他們提供的巨大優勢是它們允許您添加或刪除類而不影響其他類名稱集。

的Attr（）方法使用這樣的事情：

document.getElementById("MyElementID")[name] = value;

對於您只需要一個類名的情況下，該屬性的方法將可能更快。但是我個人發現addClass方法更優雅，更容易適應，如果您將來需要添加更多的類名稱。

來源

2011-05-19 07:56:02 kgiannakakis

我想你應該檢查所有這些功能的性能。我個人認爲prop方法是最快的（在V1.6中引入）

看到這裏的表現jQuery的（）。ATTR VS jQuery的（）。數據VS jQuery的（）。支撐

http://jsperf.com/jquery-data-vs-jqueryselection-data/8

來源

2011-05-19 07:41:19 diEcho

不幸的是，我有點受限制。我們可以假設我使用jQuery前的1.6版本 – 2011-05-19 07:52:27

所不同的是在這個傢伙：

<div class="a_class another_class a_third_class">

ATTR（「類」，「no_other_classes_now」）< - 將替換類屬性的一切，即使有多個空格分隔類。這可能是JQ方法的最輕重量，因爲它只是使用DOM方法，而這些DOM方法已經在瀏覽器中正常工作了十多年了。

.removeClass（'a_third_class'）將移除一個類，並保持其他類不變。

。addClass（'a_fourth_class'）將添加空格分隔的類而不替換其他類。

^^因爲他們需要做查找/替換類型的操作，所以這兩者對於簡單的類覆蓋要比attr做更多的工作。

Prop用於改變沒有HTML代表的DOM元素的屬性，例如窗口對象（由於其他便捷方法，不常用）或者會令人困惑，因爲不同的屬性字符串可能意味着不同的事物。就像布爾型（僅限真/假）JS屬性在某些特定風格的HTML中所關注的那樣，只需將「checked」屬性等號爲checked =「checked」或checked =「true」即可。使用道具你會得到javascript屬性，而不一定是被認爲是在實際HTML元素的引號之間的任何東西。

當你不在這種情況下，我會堅持使用attr方法。道具的整個觀點似乎是從舊的attr方法開始工作，所以如果在大多數情況下速度更快，我會感到驚訝。更重要的是它很常見並且易於閱讀。

來源

2011-05-19 08:22:07

Reppen - 感謝您的回答。我意識到各種方法之間的差異。我只是希望對兩個例子進行相對比較。 – 2011-05-19 08:40:57

是否有設置使用jQuery

回答

相關問題