使用JavaScript切換能見度與CSS對比

剛剛發現了約the CSS tilde selector，它似乎可能是一種處理切換輸入可見性的優雅方式。使用JavaScript切換能見度與CSS對比

我想到的用例是當您只想在用戶選中複選框時向用戶顯示輸入。目前我使用javascript來完成此操作，並將偵聽器附加到每個複選框，然後通過DOM進行搜索以找到合適的輸入並切換一個類。

所以問題是，爲什麼這不好？如果不是，爲什麼這不是普遍的？爲什麼我們使用.js而不是CSS來做到這一點？在我看來，他們都以相當類似的方式操縱表示層...

資源獎勵點。

來源

2013-02-06 Fred Stevens-Smith

「不流行」！=「不好」。 –

我不認爲這種方式不好，但它不那麼直觀。我發現不好的是在檢查一個不相關的複選框時顯示輸入。 –

P.S .:你將如何獎勵我們的獎勵積分？ –

我想到的用例是當您只想在用戶選中複選框時向用戶顯示輸入。

如果你打算使用:checked選擇使用這項功能，應用程序不會在舊的瀏覽器上運行（IE < 9）。如果你有這個限制，也就是說，只有現代瀏覽器有關，CSS也可以。

使用JS可確保您的網站也能在較舊的瀏覽器上運行，只要用戶啓用了JS。

您也可以混合使用這兩者，它將確保您的網頁在現代瀏覽器中工作，即使JS禁用以及啓用JS的舊瀏覽器。

檢測瀏覽器是否禁用JS（例如，使用<noscript>中的樣式表）比確定瀏覽器是否支持某些CSS選擇器通常更容易。
因此，使用JS解決方案可讓您輕鬆放置免責聲明，要求用戶啓用JS以使頁面正常工作。

儘管如此，如果您的網站不是針對可能使用IE8及以下版本的公衆，那麼CSS解決方案也可以。

來源

2013-02-06 16:22:37

HTML是Model，它包含的數據
CSS是視圖，它包含了樣式
JS是控制器，它包含了互動

這MVC結構使得對責任的一個強大的代表團。如果你想改變一個頁面上的小部件的狀態，你可以使用JavaScript來改變現有的造型掛鉤：用於縮寫

$('#button').on('click', function() { 
    $('#widget').toggleClass('hidden'); 
});

_{CSS
_的jQuery： .hidden {
display: none;
}
使用這個結構很容易讓你改變交互方式。如果您稍後決定該小部件應該是動畫的，這是一個簡單的改變。
使用JavaScript還具有向後兼容的優勢。禁用JavaScript的用戶比例非常少。儘管我強烈建議用JS禁用，但通常只需通過默認顯示所有內容即可完成，而隱藏事項僅適用於啓用了JS的用戶。}

來源

2013-02-06 16:23:41 zzzzBov

我會說，如果你可以擺脫使用代字符選擇器或一般的CSS，然後去爲它。 CSS imho是一種更清潔，通常更簡潔和更優越的性能方式，可以完成與切換js中的項目相同的功能。此外，對代字號的眉毛支持還是相當不錯的 - 請參閱http://www.quirksmode.org/css/contents.html

有時您必須使用javascript來完成此操作，例如，要隱藏的元素不是所涉及元素的兄弟或後代。

來源

2013-02-06 16:29:36

使用JavaScript切換能見度與CSS對比

回答

相關問題