noscript 標(biāo)簽 一個(gè)被忽視的重要標(biāo)簽
Javascript 的日益強(qiáng)大使我們的網(wǎng)頁豐富多彩,交互越來越強(qiáng)大,功能越來越炫。但是有的網(wǎng)頁效果完全依賴 Javascript 來實(shí)現(xiàn),一旦離開了 Javascript 的支持,可能連基本的內(nèi)容都顯示不完全,這時(shí)候,我們老當(dāng)益壯的noscript標(biāo)簽就該出場(chǎng)了
NOSCRIPT標(biāo)簽用來定義在腳本未被執(zhí)行時(shí)的替代內(nèi)容。也可以用在檢測(cè)瀏覽器是否支持腳本,若不支持腳本則可以顯示NOSCRIPT標(biāo)簽里的innerText.
<body> ... ... <script type="text/javascript"> <!-- document.write("Hello World!") //--> </script><noscript>Your browser does not support JavaScript!</noscript>... ... </body>
noscript標(biāo)簽是一個(gè)相當(dāng)古老的標(biāo)簽,其被引入的最初目的是幫助老舊瀏覽器的平滑升級(jí)更替,因?yàn)樵缙诘臑g覽器并不能支持 JavaScript。noscript 標(biāo)簽在不支持JavaScript 的瀏覽器中顯示替代的內(nèi)容。這個(gè)元素可以包含任何 HTML 元素。這個(gè)標(biāo)簽的用法也非常簡單:
<noscript> <p>本頁面需要瀏覽器支持(啟用)JavaScript</p> </noscript>
不過到了現(xiàn)在,瀏覽器不支持 Javascript 的事情應(yīng)該已經(jīng)不會(huì)出現(xiàn)了,但是用戶也可能因?yàn)楦鞣N原因而禁用了 Javascript。如節(jié)省流量,延長電池使用時(shí)間,或者是不希望自己的隱私被各類統(tǒng)計(jì)/追蹤腳本泄露。
也有相當(dāng)一部分用戶安裝了類似NoScript的瀏覽器擴(kuò)展來禁止瀏覽器運(yùn)行 Javascript。
網(wǎng)站雖然不能強(qiáng)制用戶啟用瀏覽器的 Javascript,但是可以提示用戶的瀏覽器已經(jīng)禁用腳本,來達(dá)到更好的用戶體驗(yàn)。例如 Fackbook 這樣的提示:
noscript 標(biāo)簽中的元素中的內(nèi)容只有在下列情況下才會(huì)顯示出來:
- 瀏覽器不支持腳本
- 瀏覽器支持腳本,但腳本被禁用
符合上述任何一個(gè)條件,瀏覽器都會(huì)顯示 noscript 中的內(nèi)容。而在除此之外的其他情況下,瀏覽器不會(huì)呈現(xiàn) noscript 中的內(nèi)容。
寫在最后
使用 noscript 標(biāo)簽只能給網(wǎng)站用戶傳達(dá)一個(gè)信息,即如果不啟用 Javascript,網(wǎng)頁內(nèi)容和效果可能不能完全被呈現(xiàn)。但如果有些用戶并不懂得如何去開啟 Javascript的話,這樣的提示信息對(duì)他也并沒有什么實(shí)際的幫助。所以我們還是應(yīng)該在網(wǎng)站設(shè)計(jì)之初多多考慮在沒有 Javascript(或 HTML5,或其他依賴)的支持的情況下,如何使這樣的非常規(guī)狀況盡可能少的影響到用戶的瀏覽體驗(yàn)。
相關(guān)文章
JS實(shí)現(xiàn)漂亮的窗口拖拽效果(可改變大小、最大化、最小化、關(guān)閉)
這篇文章主要介紹了JS實(shí)現(xiàn)漂亮的窗口拖拽效果,具有可改變大小、最大化、最小化、關(guān)閉等功能,以完整實(shí)例形式較為詳細(xì)的分析了JavaScript操作窗口的大小改變、還原及關(guān)閉等功能的相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2015-10-10JavaScript實(shí)現(xiàn)背景自動(dòng)切換小案例
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)背景自動(dòng)切換小案例,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-09-09通過BootStrap-select插件 js jQuery控制select屬性變化
bootstrap-select我想大家都不陌生是一個(gè)前端下拉框的插件非常好用,在select的標(biāo)簽中設(shè)置屬性可以做很多功能控制,下面通過本文給大家詳細(xì)介紹下2017-01-01js+css使DIV始終居于屏幕中間 左下 左上 右上 右下的代碼集合
js+css使DIV始終居于屏幕中間 左下 左上 右上 右下的代碼集合,需要的朋友可以參考下。2011-03-03自動(dòng)完成的搜索框javascript實(shí)現(xiàn)
這篇文章主要介紹了自動(dòng)完成的搜索框javascript實(shí)現(xiàn)代碼,感興趣的小伙伴們可以參考一下2016-02-02uniapp開發(fā)小程序的經(jīng)驗(yàn)總結(jié)
這篇文章主要給大家介紹了關(guān)于uniapp開發(fā)小程序的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-04-04原生JS實(shí)現(xiàn)風(fēng)箱式demo,并封裝了一個(gè)運(yùn)動(dòng)框架(實(shí)例代碼)
下面小編就為大家?guī)硪黄鶭S實(shí)現(xiàn)風(fēng)箱式demo,并封裝了一個(gè)運(yùn)動(dòng)框架(實(shí)例代碼)。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-07-07JavaScript實(shí)現(xiàn)一鍵復(fù)制文本功能的示例代碼
這篇文章主要為大家介紹兩種javascript實(shí)現(xiàn)文本復(fù)制(將文本寫入剪貼板)的方法,文中的示例代碼講解詳細(xì),大家可以根據(jù)需求特點(diǎn)選用2023-03-03