JavaScript CSS選擇器

Question

我正在閱讀一些JavaScript嘗試創建自己的滑塊，但遇到了一些讓我感到困惑的東西。 有一條CSS規則如下：

html.js #slideshow .slides img
{
    position: absolute;
}

說明說該規則僅在JavaScript可用時才適用。 現在我有點困惑...如果瀏覽器中提供JavaScript，是否可以應用此規則？ 還是在HTML頁面中包含了文件“ html.js”，或者是否包含了JavaScript文件？

提前致謝。

Answer 1

這是一種使用javascript將類“ js”添加到html標簽的技術。 沒有javascript，沒有js類。 使CSS非常容易知道是否啟用了JS。

Answer 2

可能在頁面中您的頭上有一個腳本，該腳本將js類添加到根元素

這樣可以確保僅當客戶端上有javascript時才應用CSS規則。 當然，如果無法使用javascript，則腳本不會插入該類。

這是一種現代方法，專門用於防止未樣式化內容（FOUC）的閃爍

Answer 3

您看到的頁面可能正在使用Modernizr 。 它是一個JavaScript庫，可檢測用戶瀏覽器中的HTML5和CSS3功能，並通過向HTML元素添加“ no-js”類來工作，並且當頁面加載Modernizr時，將其替換為要測試的規則集。

如果要在瀏覽器中測試特定功能，請訪問Modernizr網站以獲取更多詳細信息。

在您不希望使用Modernizr的情況下，您可以將JavaScript直接放置在<title>標記中，以實現JavaScript：

<script>
    document.documentElement.className = document.documentElement.className.replace(/(\s|^)no-js(\s|$)/, '$1' + 'js' + '$2');
</script>