搜尋
首頁web前端H5教程分享幾個html5冷門小知識

HTML是Web同一語言,這些容納在尖括號裡得大略標籤,構成瞭如今得Web。 1991 年,Tim Berners-Lee編寫了一份叫做「HTML 標籤」得文檔,內裡包括了大約20個用來標記網頁得 HTML標籤。他直接借用SGML得標示款式,也便是其後我們看到得HTML標示得款式。

今天互吾小編就整理下,那些你可能不知道的html5冷知識。

瀏覽器網址列運行JavaScript程式碼
這個很多人應該還是知道的,在瀏覽器網址列可以直接執行JavaScript程式碼,做法是以javascript:開頭後接著執行的語句。例如:

分享幾個html5冷門小知識

注意,執行javascript程式碼,要在瀏覽器中手動輸入,複製程式碼的話,IE及Chr ome會自動去掉程式碼開頭的javascript:,所以需要手動添加起來才能正確執行,而Firefox中雖然不會自動去掉,但它根本就不支援在網址列運行JS程式碼! !

瀏覽器網址列運行HTML程式碼
如果說上面那條小秘密知道的人還算多的話,這條秘笈知道的人就要少一些了,在非IE內核的瀏覽器網址列可以直接運行HTML程式碼!

反正連互吾小編我,也是最近才無意間得知的。

例如在網址列輸入以下程式碼然後回車運行,會出現指定的頁面內容。

分享幾個html5冷門小知識

如下圖:

分享幾個html5冷門小知識

把瀏覽器當作編輯器
還是瀏覽器網址列上做文章,將以下程式碼貼到網址列運行後瀏覽器變成了一個原始而簡單的編輯器,與Windows自帶的notepad一樣,吼吼。

分享幾個html5冷門小知識

如下圖:

分享幾個html5冷門小知識

#歸根結底多虧了HTML5中新增的contenteditable屬性,當元素指定了該屬性後,元素的內容變成可編輯狀態

推而廣之,將以下程式碼放到console執行後,整個頁面將變得可編輯!

分享幾個html5冷門小知識

如下圖:

分享幾個html5冷門小知識

利用a標籤自動解析URL
很多時候我們有從一個URL中提取域名,查詢關鍵字,變數參數值等的需要,而萬萬沒想到可以讓瀏覽器方便地幫我們完成這項任務而不用我們寫正則去抓取。方法就在JS程式碼裡先建立一個a標籤然後將需要解析的URL賦值給a的href屬性,然後就得到了一切我們想要的了。

分享幾個html5冷門小知識

如下圖:

分享幾個html5冷門小知識

#用上面方法,對瀏覽器參數進行操作!

分享幾個html5冷門小知識

頁面擁有ID的元素會建立全域變數
在一張HTML頁面中,所有設定了ID屬性的元素會在JavaScript的執行環境中建立對應的全域變量,這表示document.getElementById像人的闌尾一樣顯得多餘了。但實際專案中最好老實該怎麼寫就怎麼寫,畢竟常規程式碼出亂子的機會要小得多。

分享幾個html5冷門小知識

如下圖:

分享幾個html5冷門小知識

#載入CDN檔案時,可以省掉HTTP標識
現在很流行的CDN即從專門的伺服器加載一些通用的JS和CSS文件,出於安全考慮有的CDN伺服器使用HTTPS方式連接,而有的是傳統的HTTP,其實我們在使用時可以忽略掉這個,將它從URL中省去。

分享幾個html5冷門小知識

利用script標籤保存任意資訊
將script標籤設為type='text'然後可以在裡面保存任意信息,之後可以在JavaScript程式碼中很方便地取得。

分享幾個html5冷門小知識

當然,冷知識遠不止這些。

【相關推薦】

1. 免費h5線上影片教學

2. HTML5 完整版手冊

#3. php.cn原始html5影片教學

#

以上是分享幾個html5冷門小知識的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
H5指的是什麼?探索上下文H5指的是什麼?探索上下文Apr 12, 2025 am 12:03 AM

H5referstoHTML5,apivotaltechnologyinwebdevelopment.1)HTML5introducesnewelementsandAPIsforrich,dynamicwebapplications.2)Itsupportsmultimediawithoutplugins,enhancinguserexperienceacrossdevices.3)SemanticelementsimprovecontentstructureandSEO.4)H5'srespo

H5:工具,框架和最佳實踐H5:工具,框架和最佳實踐Apr 11, 2025 am 12:11 AM

H5開發需要掌握的工具和框架包括Vue.js、React和Webpack。 1.Vue.js適用於構建用戶界面,支持組件化開發。 2.React通過虛擬DOM優化頁面渲染,適合複雜應用。 3.Webpack用於模塊打包,優化資源加載。

HTML5的遺產:當前了解H5HTML5的遺產:當前了解H5Apr 10, 2025 am 09:28 AM

HTML5hassignificantlytransformedwebdevelopmentbyintroducingsemanticelements,enhancingmultimediasupport,andimprovingperformance.1)ItmadewebsitesmoreaccessibleandSEO-friendlywithsemanticelementslike,,and.2)HTML5introducednativeandtags,eliminatingthenee

H5代碼:可訪問性和語義HTMLH5代碼:可訪問性和語義HTMLApr 09, 2025 am 12:05 AM

H5通過語義化元素和ARIA屬性提升網頁的可訪問性和SEO效果。 1.使用、、等元素組織內容結構,提高SEO。 2.ARIA屬性如aria-label增強可訪問性,輔助技術用戶可順利使用網頁。

H5與HTML5相同嗎?H5與HTML5相同嗎?Apr 08, 2025 am 12:16 AM

"h5"和"HTML5"在大多數情況下是相同的,但它們在某些特定場景下可能有不同的含義。 1."HTML5"是W3C定義的標準,包含新標籤和API。 2."h5"通常是HTML5的簡稱,但在移動開發中可能指基於HTML5的框架。理解這些區別有助於在項目中準確使用這些術語。

H5的功能是什麼?H5的功能是什麼?Apr 07, 2025 am 12:10 AM

H5,即HTML5,是HTML的第五個版本,它為開發者提供了更強大的工具集,使得創建複雜的網頁應用變得更加簡單。 H5的核心功能包括:1)元素允許在網頁上繪製圖形和動畫;2)語義化標籤如、等,使網頁結構清晰,利於SEO優化;3)新API如GeolocationAPI,支持基於位置的服務;4)跨瀏覽器兼容性需要通過兼容性測試和Polyfill庫來確保。

h5鏈接怎麼做h5鏈接怎麼做Apr 06, 2025 pm 12:39 PM

如何創建 H5 鏈接?確定鏈接目標:獲取 H5 頁面或應用程序的 URL。創建 HTML 錨點:使用 <a> 標記創建錨點並指定鏈接目標URL。設置鏈接屬性(可選):根據需要設置 target、title 和 onclick 屬性。添加到網頁:將 HTML 錨點代碼添加到希望鏈接出現的網頁中。

h5兼容問題怎麼解決h5兼容問題怎麼解決Apr 06, 2025 pm 12:36 PM

解決 H5 兼容問題的方法包括:使用響應式設計,允許網頁根據屏幕尺寸調整佈局。採用跨瀏覽器測試工具,在發布前測試兼容性。使用 Polyfill,為舊瀏覽器提供對新 API 的支持。遵循 Web 標準,使用有效的代碼和最佳實踐。使用 CSS 預處理器,簡化 CSS 代碼並提高可讀性。優化圖像,減小網頁大小並加快加載速度。啟用 HTTPS,確保網站的安全性。

See all articles

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
3 週前By尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
3 週前By尊渡假赌尊渡假赌尊渡假赌
WWE 2K25:如何解鎖Myrise中的所有內容
3 週前By尊渡假赌尊渡假赌尊渡假赌

熱工具

DVWA

DVWA

Damn Vulnerable Web App (DVWA) 是一個PHP/MySQL的Web應用程序,非常容易受到攻擊。它的主要目標是成為安全專業人員在合法環境中測試自己的技能和工具的輔助工具,幫助Web開發人員更好地理解保護網路應用程式的過程,並幫助教師/學生在課堂環境中教授/學習Web應用程式安全性。 DVWA的目標是透過簡單直接的介面練習一些最常見的Web漏洞,難度各不相同。請注意,該軟體中

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

這個專案正在遷移到osdn.net/projects/mingw的過程中,你可以繼續在那裡關注我們。 MinGW:GNU編譯器集合(GCC)的本機Windows移植版本,可自由分發的導入函式庫和用於建置本機Windows應用程式的頭檔;包括對MSVC執行時間的擴展,以支援C99功能。 MinGW的所有軟體都可以在64位元Windows平台上運作。

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser是一個安全的瀏覽器環境,安全地進行線上考試。該軟體將任何電腦變成一個安全的工作站。它控制對任何實用工具的訪問,並防止學生使用未經授權的資源。

Atom編輯器mac版下載

Atom編輯器mac版下載

最受歡迎的的開源編輯器

mPDF

mPDF

mPDF是一個PHP庫,可以從UTF-8編碼的HTML產生PDF檔案。原作者Ian Back編寫mPDF以從他的網站上「即時」輸出PDF文件,並處理不同的語言。與原始腳本如HTML2FPDF相比,它的速度較慢,並且在使用Unicode字體時產生的檔案較大,但支援CSS樣式等,並進行了大量增強。支援幾乎所有語言,包括RTL(阿拉伯語和希伯來語)和CJK(中日韓)。支援嵌套的區塊級元素(如P、DIV),