noscript 標簽在 Internet Explorer 上不起作用

Question

我有一個帶有<noscript>標簽的網站，它在除 IE (7,8,9,10) 之外的所有瀏覽器上都可以正常工作。 在 Internet 選項中的安全設置下禁用腳本后，在我的 PC 上，我只能在 IE 上查看<noscript>內容，但在其他 PC（幾乎所有）上我看不到代碼。 使用這些 PC，我們對 Gmail 和 FB 的站點使用相同的設置，我們確實收到了未啟用 js 的警告。

這是 HTML：

<noscript>
    <div class="noscript">
        JavaScript must be enabled in order for you to use WEBSITE NAME in standard view.<br />
        However, it seems JavaScript is either disabled or not supported by your browser.<br />
        To use standard view, enable JavaScript by changing your browser options, then <a href="">try again</a>. 
    </div>
</noscript>

CSS：

.noscript {
    background: red;
    color: #fff;
    padding: 10px;
    text-align: center;
    position: relative;
    z-index: 3;
}

有任何想法嗎？

謝謝！

Answer 1

也遇到了這個問題。 我在 IE 中使用了它，然后它突然停止了。 我發現，如果您的 css 嵌套在實際 css 定義中的 noscript 標簽下，它將無法工作。 如果你只使用一個類名就好了。

我正在使用 IE 10 進行測試，並使用他們的開發工具將文檔模式更改為較舊的瀏覽器模式進行驗證。 實際使用舊瀏覽器時，結果可能會有所不同。 如果是這種情況，請報告。

示例 html：

<noscript>
    <div class="noscript">
        JavaScript must be enabled ...
    </div>
</noscript>

不起作用：

// classes nested beneath a noscript tag are not applied by IE
noscript div.noscript {
        display: block;
        text-align: center;
        color: white;
        font-weight: 700;
        background: #D53333;
        margin: 0 auto;
        padding: 4px;
    }

是否有效：

div.noscript {
    display: block;
    text-align: center;
    color: white;
    font-weight: 700;
    background: #D53333;
    margin: 0 auto;
    padding: 4px;
}

Answer 2

甚至我也遇到過這種情況，所以經過多次斗爭，我設計了一個很好的技巧。 不用設置noscript標簽的樣式，而是在 div 中禁用 javascript 時覆蓋要顯示的元素，然后使用 javascript 不顯示該 div。 因此，當 javascript 被禁用時，查看器將看到您希望他們看到的 div，但如果啟用了 javascript，該 div 將被您編寫的腳本設置為不顯示樣式，使其不可見。

請參閱下面的示例：

通常我們這樣做：

• html: <noscript> please enable javascript ... </noscript>
• CSS： noscript{background-color: red; color: white; font-size: 24px; ... } noscript{background-color: red; color: white; font-size: 24px; ... }

---

而是這樣做：

• html: <div class="noscript"> please enable javascript </div>
• CSS： .noscript{background-color: red; color: white; font-size: 24px; ... } .noscript{background-color: red; color: white; font-size: 24px; ... }
• js: const noscript = document.querySelector('.noscript').style.display="none";

Answer 3

試試這個 css

.noscript {
   background: red;
   top: 100px; 
   color: #fff;
   padding: 10px;
   text-align: center;
   position: relative;
   z-index: 3;
}