當前位置：首頁 > 前端技术 > HTML >内容正文

HTML

DHTML---HTML5

發布時間：2023/12/20 HTML 23 豆豆

生活随笔收集整理的這篇文章主要介紹了 DHTML---HTML5 小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

?

1. HTML概述

　　網頁是網站的表現層,各種編程語言（如Java）構成后臺的邏輯,我們將后臺邏輯做好然后通過頁面表達。同時通過網頁來與后臺進行交互。而Html是我們做網頁的基礎,由瀏覽器來解析。

1.1 HTML概念

HTML（HyperText Markup Language ）即超文本標記語言【超文本HyperText（規范）：

超文本是用超鏈接的方法，將各種不同空間的文字信息組織在一起的網狀文本。

鏈接 Hyper Link：超鏈接在本質上屬于一個網頁的一部分，它是一種允許我們同其他網頁或站點之間進行連接的元素。各個網頁鏈接在一起后，才能真正構成一個網站。所謂的超鏈接是指從一個網頁指向一個目標的連接關系,這個目標可以是另一個網頁,也可以是相同網頁上的不同位置，還可以是一個圖片，一個電子郵件地址，一個文件，甚至是一個應用程序。而在一個網頁中用來超鏈接的對象，可以是一段文本或者是一個圖片。當瀏覽者單擊已經鏈接的文字或圖片后,鏈接目標將顯示在瀏覽器上，并且根據目標的類型來打開或運行。

標記語言Mark-up Language：就是由標記構成的語言。標記來構成不同的內容。例如：表達圖片 <img>]，標記語言是 WWW 的描述語言，由 Tim Berners-lee提出。】它是互聯網上應用最廣泛的標記語言。HTML只是一種標記語言，簡單來說，HTML就是普通文本+HTML標記（標簽），不同的HTML標記展現不同的效果；設計 HTML 語言的目的是為了能把存放在一臺電腦中的文本或圖形與另一臺電腦中的文本或圖形方便地聯系在一起，形成有機的整體，人們不用考慮具體信息是在當前電腦上還是在網絡的其它電腦上。這樣，你只要使用鼠標在某一文檔中點取一個圖標，Internet就會馬上轉到與此圖標相關的內容上去，而這些信息可能存放在網絡的另一臺電腦中。 HTML文本是由 HTML命令組成的描述性文本，HTML 命令可以說明文字、圖形、動畫、聲音、表格、鏈接等。 HTML的結構包括頭部 (Head)、主體 (Body) 兩大部分。頭部描述瀏覽器所需的信息，主體包含所要說明的具體內容。

HTML是一種弱勢語言,不區分大小寫,不是一種編程語言(編程語言有編譯過程)，是一種描述性的標記語言(標記語言沒有編譯過程)，用于描述超文本中內容的顯示方式。比如字體什么顏色，大小等。簡單來說，HTML文件就是普通文本+HTML標記（也叫HTML標簽），不同的HTML標記能表示不同的效果。Java則是一種強勢語言,必須嚴格按照語法標準。

1.2 HTML的流程

HTML網頁上面我們提出申請--服務器接受并處理返回我們的申請(例如:我們申請取消訂單--服務器接受--處理申請--將結果通知用戶(已刪除或未刪除)),返回的其實是HTML代碼

1.3 HTML的歷史

HTML的發展歷史“比較復雜”，因為它實在太“隨意”了，而負責解析HTML的瀏覽器又太“寬容”了，以至于到了“寫一份對的HTML文檔很容易，寫一份錯的HTML文檔很難”的程度。而且不同瀏覽器之間又存在一些差異，因此導致HTML給人的感覺比較混亂。

從HTML面世開始，它就顯得“很不正規”：1991年底推出HTML，但最早的HTML并沒有任何嚴格的定義。直到1993年，IETF（國際互聯網工程任務組（The Internet Engineering Task Force）才開始發布HTML規范的草案。在HTML語言的發展歷史中，大致經歷了如下的發展歷史：

HTML（第一版）:1993年6月由互聯網工程工作小組（IETF Internet Engineering Task Force）發布的HTML工作草案。
HTML 2.0：1995年11月作為RFC 【Request For Comments（RFC），是一系列以編號排定的文件。文件收集了有關互聯網相關信息，以及UNIX和互聯網社區的軟件文件。目前RFC文件是由Internet Society（ISOC）贊助發行。基本的互聯網通信協議都有在RFC文件內詳細說明。RFC文件還額外加入許多的論題在標準內，例如對于互聯網新開發的協議及發展中所有的記錄。因此幾乎所有的互聯網標準都有收錄在RFC文件之中。】1866發布。
HTML 3.2：1996年1月14日由W3C（萬維網聯盟?World Wide Web Consortium）組織發布，是HTML文檔第一個被廣泛使用的標準。在HTML 3.2之前，HTML發展極其混亂，各軟件廠商經常自行增加HTML標記，而各瀏覽器廠商為了保持最好的兼容性，總是盡力支持各種HTML標記。它是HTML歷史中廣為人知的版本。
HTML 4.0：1997年12月18日由W3C組織發布，也是W3C推薦標準。
HTML 4.01：1999年12月24日由W3C組織發布，是HTML文檔的另一個重要的、廣泛使用的標準，它具有了更好的兼容性。
XHTML 1.0：XHTML（可擴展超文本標記語言?Extensible HyperText Markup Language）發布于2000年1月26日，是W3C組織推薦標準，后來經過修訂于2002年8月1日重新發布。它的目標是逐漸取代原有的HTML標準，簡單說，XHTML就是最新版本的HTML規范。我們習慣上認為HTML也是一種結構化文檔，但實際上HTML語法非常自由、寬容、不規范，而XHTML致力于消除這種不規范，XHTML要求HTML文檔首先必須是一份XML文檔。

　　　　XML文檔是一種結構化文檔，它有如下四條基本規則：

　　　　　　v?整個文檔有且僅有一個根元素。

　　　　　　v?每個元素都由開始標簽和結束標簽組成（例如<p>和</p>就是開始標簽和結束標簽），除非使用空元素語法（例如</br>就是空元素語法）。

　　　　　　v?元素和元素之間應該合理嵌套（<a><b>內容</b></a>和<a><b>內容</a></b>前者屬于合理嵌套，后者屬于不合理嵌套）。

　　　　　　v?元素的屬性必須有屬性值，而且屬性值應該用引號（單引號和雙引號都可以）引起來。

　　通常，計算機里的瀏覽器可以對付各種不同規范的HTML文檔，但現在很多瀏覽器運行在移動電話和手持設備上面，它們就沒有能力來處理那些糟糕的標記語言。

為此，W3C建議使用XML規范來約束HTML文檔，將HTML和XML的長處加以結合，從而得到現在和未來都能使用的標記語言：XHTML。

XHTML可以被所有的支持XML的設備讀取，在其余的瀏覽器升級至支持XML之前，XHTML強制HTML文檔具有更好的結構，保證這些文檔可以被所有的瀏覽器解釋。

HTML5：萬維網的核心語言、標準通用標記語言下的一個應用超文本標記語言（HTML）的第五次重大修改。2014年9月發布，2014年10月29日，萬維網聯盟宣布，經過接近8年的艱苦努力，該標準規范終于制定完成。

1.4 HTML的網絡術語

1.4.1靜態網頁

在網站設計中，純粹HTML（標準通用標記語言下的一個應用）格式的網頁通常被稱為“靜態網頁”，靜態網頁是標準的HTML文件，它的文件擴展名是.htm、.html，可以包含文本、圖像、聲音、FLASH動畫、客戶端腳本和ActiveX控件及JAVA小程序等。靜態網頁是網站建設的基礎，早期的網站一般都是由靜態網頁制作的。靜態網頁是相對于動態網頁而言，是指沒有后臺數據庫、不含程序和不可交互的網頁。靜態網頁相對更新起來比較麻煩，適用于一般更新較少的展示型網站。容易誤解的是靜態頁面都是htm這類頁面，實際上靜態也不是完全靜態，他也可以出現各種動態的效果，如GIF格式的動畫、FLASH、滾動字幕等。

1.4.2 動態網頁（Dhtml Dynamic HTML）

所謂的動態網頁，是指跟靜態網頁相對的一種網頁編程技術。靜態網頁，隨著html代碼的生成，頁面的內容和顯示效果就基本上不會發生變化了——除非你修改頁面代碼。而動態網頁則不然，頁面代碼雖然沒有變，但是顯示的內容卻是可以隨著時間、環境或者數據庫操作的結果而發生改變的。值得強調的是，不要將動態網頁和頁面內容是否有動感混為一談。這里說的動態網頁，與網頁上的各種動畫、滾動字幕等視覺上的動態效果沒有直接關系，動態網頁也可以是純文字內容的，也可以是包含各種動畫的內容，這些只是網頁具體內容的表現形式，無論網頁是否具有動態效果，只要是采用了動態網站技術生成的網頁都可以稱為動態網頁。總之，動態網頁是基本的html語法規范與Java、VB、VC等高級程序設計語言、數據庫編程等多種技術的融合，以期實現對網站內容和風格的高效、動態和交互式的管理。因此，從這個意義上來講，凡是結合了HTML以外的高級程序設計語言和數據庫技術進行的網頁編程技術生成的網頁都是動態網頁。

1.4.3 W3C

萬維網聯盟（World Wide Web Consortium）創建于1994年，是Web技術領域最具權威和影響力的國際中立性技術標準機構。

1.4.4 網站

網站(Website)是指在因特網上根據一定的規則，使用HTML（標準通用標記語言下的一個應用）等工具制作的用于展示特定內容相關網頁的集合。簡單地說，網站是一種溝通工具，人們可以通過網站來發布自己想要公開的資訊，或者利用網站來提供相關的網絡服務。人們可以通過網頁瀏覽器來訪問網站，獲取自己需要的資訊或者享受網絡服務。

1.4.4.1 網站的組成

在早期，域名、空間服務器與程序是網站的基本組成部分，隨著科技的不斷進步，網站的組成也日趨復雜，目前多數網站由域名、空間服務器、DNS域名解析、網站程序、數據庫等組成。

域名

域名（Domain Name），是由一串用點分隔的字母組成的Internet上某一臺計算機或計算機組的名稱。用于在數據傳輸時標識計算機的電子方位（有時也指地理位置），域名已經成為互聯網的品牌、網上商標保護必備的產品之一。通俗的說，域名就相當于一個家庭的門牌號碼，別人通過這個號碼可以很容易的找到你。以一個常見的域名為例說明，baidu網址是由二部分組成，標號“baidu”是這個域名的主域名體，而最后的標號“com”則是該域名的后綴，代表的這是一個com國際域名，是頂級域名。而前面的www.是網絡名，為www的域名。DNS規定，域名中的標號都由英文字母和數字組成。每一個標號不超過63個字符，也不區分大小寫字母。標號中除連字符（-）外不能使用其他的標點符號。級別最低的域名寫在最左邊，而級別最高的域名寫在最右邊。

空間

常見網站空間：虛擬主機，虛擬空間，獨立服務器，云主機，VPS。

虛擬主機是在網絡服務器上劃分出一定的磁盤空間供用戶放置站點、應用組件等；提供必要的站點功能、數據存放和傳輸功能。所謂虛擬主機，也叫“網站空間”，就是把一臺運行在互聯網上的服務器劃分成多個“虛擬”的服務器。每一個虛擬主機都具有獨立的域名和完整的Internet服務器（支持WWW、FTP、E-mail等）功能。虛擬主機是網絡發展的福音，極大的促進了網絡技術的應用和普及。同時虛擬主機的租用服務也成了網絡時代新的經濟形式。虛擬主機的租用類似于房屋租用。

VPS即指虛擬專用服務器，是將一個服務器分區成多個虛擬獨立專享服務器的技術。每個使用VPS技術的虛擬獨立服務器擁有各自獨立的公網IP地址、操作系統、硬盤空間、內存空間、CPU資源等，還可以進行安裝程序、重啟服務器等操作，與運行一臺獨立服務器完全相同。

程序/源代碼

程序即建設與修改網站所使用的編程語言，換成源代碼就是一堆按一定格式書寫的文字和符號。“比如在這個網頁上右鍵鼠標，選擇查看源文件，出來一個記事本，里面的內容就是此網頁的源代碼。”這句話就體現了他們的關系，此處的源文件是指網頁的源代碼，而源代碼就是源文件的內容，所以又可以稱做網頁的源代碼。

源代碼是指原始代碼，可以是任何語言代碼。匯編碼是指源代碼編譯后的代碼，通常為二進制文件，比如DLL、EXE、.NET中間代碼、JAVA中間代碼等。高級語言通常指C/C++ 、 BASIC、C# 、JAVA、PASCAL 等等　匯編語言就是ASM，只有這個，比這個更低級的就是機器語言了。

瀏覽器就好像程序的編譯器，它會幫我們把源代碼翻譯成看到的模樣。

1.4.4.2 網站的分類

根據網站所用編程語言分類：例如asp網站、php網站、jsp網站、Asp. net網站等；

根據網站的用途分類：例如門戶網站（綜合網站）、行業網站、娛樂網站等；

根據網站的功能分類：例如單一網站（企業網站）、多功能網站（網絡商城）等等。

根據網站的持有者分類：例如個人網站、商業網站、政府網站、教育網站等。

根據網站的商業目的分類：營利型網站（行業網站、論壇）、非營利性型網站（企業網站、政府網站、教育網站）。

門戶類

門戶（portal）。原意是指正門、入口，現多用于互聯網的門戶網站和企業應用系統的門戶系統。

門戶網站多以php網站居多，php相對其他語言來說比較節省資源。

所謂門戶網站，是指通向某類綜合性互聯網信息資源并提供有關信息服務的應用系統。在全球范圍中，最為著名的門戶網站則是谷歌以及雅虎，而在中國，最著名的門戶網站有中國四大門戶網站（新浪、網易、搜狐、騰訊），其他也有百度、新華網、人民網、鳳凰網等也較為著名，其中百度已經將近可與中國四大門戶網站平起平坐

個人類

個人網站是指個人或團體因某種興趣、擁有某種專業技術、提供某種服務或把自己的作品、商品展示銷售而制作的具有獨立空間域名的網站，個人網站通常使用虛擬服務器，網站類型多以博客和小型論壇為主。

WAP類

WAP（無線通訊協議）是在數字移動電話、因特網或其他個人數字助理機（PDA）、計算機應用之間進行通訊的開放全球標準。這一標準的誕生是WAP論壇成員努力的結果，WAP論壇是在1997年6月，由諾基亞、愛立信、摩托羅拉和無線星球（Unwired Planet）就共同組成的。

1.4.5 域名

域名（Domain Name），是由一串用點分隔的名字組成的Internet上某一臺計算機或計算機組的名稱，用于在數據傳輸時標識計算機的電子方位（有時也指地理位置，地理上的域名，指代有行政自主權的一個地方區域）。域名是一個IP地址上有“面具” 。一個域名的目的是便于記憶和溝通的一組服務器的地址（網站，電子郵件，FTP等）。域名作為力所能及難忘的互聯網參與者的名稱，世界上第一個注冊的域名是在1985年1月注冊的。

1.4.5.1 基本類型

國際域名

也叫國際頂級域名（international top-level domain-names，簡稱iTDs）。這也是使用最早也最廣泛的域名。例如表示工商企業的 .com.top，表示網絡提供商的.net，表示非盈利組織的.org等。

國際域名及IP地址管理權威機構ICANN認證的域名注冊服務商（稱為Registrar）可以提供商業機構、網絡服務機構、非贏利性組織下的二級域名注冊服務，全球通過ICANN認證的Registrar有120多家，其中只有60 家是正式投入運營的Registrar。

國內域名

國內注冊的域名（也叫國家域名)，按照我們通常的習慣是指中國國內國內域名，域名以.cn結尾。此類域名由"中國互聯網絡管理中心"(CNNIC)發放冊登記。例如：.gov、.cn、.edu.cn、.com.cn、等，國內域名由中國互聯網信息中心統一管理。中國互聯網絡信息中心（China Internet Network Information Center，簡稱CNNIC）是經國家主管部門批準，于1997年6月3日組建的管理和服務機構，行使國家互聯網絡信息中心的職責。國內域名又稱為國內頂級域名（national top-level domainnames，簡稱nTLDs），即按照國家的不同分配不同后綴，這些域名即為該國的國內頂級域名。200多個國家和地區都按照ISO3166國家代碼分配了頂級域名，例如中國是cn，美國是us，日本是jp等。

在實際使用和功能上，國際域名與國內域名沒有任何區別，都是互聯網上的具有唯一性的標識。只是在最終管理機構上，國際域名由美國商業部授權的互聯網名稱與數字地址分配機構（The Internet Corporation for Assigned Names and Numbers）即ICANN負責注冊和管理；而國內域名則由中國互聯網絡管理中心（China Internet Network Information Center) 即CNNIC負責注冊和管理。

域名WHOIS

一個域名的所有者可以通過查詢WHOIS數據庫而被找到；對于大多數根域名服務器，基本的WHOIS由ICANN維護，而WHOIS的細節則由控制那個域的域注冊機構維護。對于240多個國家代碼頂級域名（ccTLDs)，通常由該域名權威注冊機構負責維護WHOIS。

注冊域名

注冊域名需要遵循先申請先注冊原則，既然域名是一種有價值的資源，那么，它是否能夠成為知識產權保護的客體呢？我們認為，在新的經濟環境下，域名所具有的商業意義已遠遠大于其技術意義，而成為企業在新的科學技術條件下參與國際市場競爭的重要手段，它不僅代表了企業在網絡上的獨有的位置，也是企業的產品、服務范圍、形象、商譽等的綜合體現，是企業無形資產的一部分。同時，域名也是一種智力成果，它是有文字含義的商業性標記，與商標、商號類似，體現了相當的創造性。在域名的構思選擇過程中，需要一定的創造性勞動，使得代表自己公司的域名簡潔并具有吸引力，以便使公眾熟知并對其訪問，從而達到擴大企業知名度、促進經營發展的目的。可以說，域名不是簡單的標識性符號，而是企業商譽的凝結和知名度的表彰，域名的使用對企業來說具有豐富的內涵，遠非簡單的“標識”二字可以窮盡。因此，不論學術界還是實際部門，大都傾向于將域名視為企業知識產權客體的一種。而且，從世界范圍來看，盡管各國立法尚未把域名作為專有權加以保護，但國際域名協調制度是通過世界知識產權組織來制定，這足以說明人們已經把域名看做知識產權的一部分。

當然，相對于傳統的知識產權領域，域名是一種全新的客體，具有其自身的特性，例如，域名的使用是全球范圍的，沒有傳統的嚴格地域性的限制；從時間性的角度看，域名一經獲得即可永久使用，并且無須定期續展；域名在網絡上是絕對唯一的，一旦取得注冊，其他任何人不得注冊、使用相同的域名，因此其專有性也是絕對的；另外，域名非經法定機構注冊不得使用，這與傳統的專利、商標等客體不同，等等。即使如此，把域名作為知識產權的客體也是科學和可行的，在實踐中對于保護企業在網絡上的相關合法權益是有利而無害的。

國際中文域名

2014年8月6日，國際頂級中文域名“.網址”正式全球開放注冊。國際頂級中文域名“.網址”于2011年被列入ICANN首批中文域名申請名錄。“.網址”具有易記、易傳播、易輸入的特點，市場前景被普遍看好。?

1.4.5.2 域名級別

頂級域名

頂級域名又分為兩類：

一是國家頂級域名（national top-level domainnames，簡稱nTLDs），200多個國家都按照ISO3166國家代碼分配了頂級域名，例如中國是cn，美國是us，日本是jp等；

二是國際頂級域名（international top-level domain names，簡稱iTDs），例如表示工商企業的 .Com .Top，表示網絡提供商的.net，表示非盈利組織的.org等。大多數域名爭議都發生在com的頂級域名下，因為多數公司上網的目的都是為了贏利。為加強域名管理，解決域名資源的緊張，Internet協會、Internet分址機構及世界知識產權組織（WIPO）等國際組織經過廣泛協商，在原來三個國際通用頂級域名：（com）的基礎上，新增加了7個國際通用頂級域名：firm（公司企業）、store（銷售公司或企業）、Web（突出WWW活動的單位）、arts（突出文化、娛樂活動的單位）、rec (突出消遣、娛樂活動的單位）、info(提供信息服務的單位）、nom(個人），并在世界范圍內選擇新的注冊機構來受理域名注冊申請。

二級域名

二級域名是指頂級域名之下的域名，在國際頂級域名下，它是指域名注冊人的網上名稱，例如 ibm，yahoo，microsoft等；在國家頂級域名下，它是表示注冊企業類別的符號，例如com，.top，edu，gov，net等。

中國在國際互聯網絡信息中心（Inter NIC）正式注冊并運行的頂級域名是CN，這也是中國的一級域名。在頂級域名之下，中國的二級域名又分為類別域名和行政區域名兩類。類別域名共7個，包括用于科研機構的ac；用于工商金融企業的com、top；用于教育機構的edu；用于政府部門的 gov；用于互聯網絡信息中心和運行中心的net；用于非盈利組織的org。而行政區域名有34個，分別對應于中國各省、自治區和直轄市。

三級域名

三級域名用字母（ A～Z，a～z，大小寫等）、數字（0～9）和連接符（－）組成，各級域名之間用實點（.）連接，三級域名的長度不能超過20個字符。如無特殊原因，建議采用申請人的英文名（或者縮寫）或者漢語拼音名（或者縮寫）作為三級域名，以保持域名的清晰性和簡潔性。

申請步驟

1、準備申請資料：com域名無需提供身份證、營業執照等資料，2012年6月3日cn域名已開放個人申請注冊，目前申請需要提供身份證或企業營業執照。

2、尋找域名注冊網站：推薦谷谷互聯，由于.com、.cn域名等不同后綴均屬于不同注冊管理機構所管理，如要注冊不同后綴域名則需要從注冊管理機構尋找經過其授權的頂級域名注冊查詢服務機構。如com域名的管理機構為ICANN，cn域名的管理機構為CNNIC（中國互聯網絡信息中心）。域名注冊查詢注冊商已經通過ICANN、CNNIC雙重認證，則無需分別到其他注冊服務機構申請域名。

3、查詢域名：在注冊商網站注冊用戶名成功后并查詢域名，選擇您要注冊的域名，并點擊域名注冊查詢。

4、正式申請：查到想要注冊的域名，并且確認域名為可申請的狀態后，提交注冊，并繳納年費。

5、申請成功：正式申請成功后，即可開始進入DNS解析管理、設置解析記錄等操作。

.中國域名

中國"域名同英文域名一樣，是互聯網上的門牌號碼。".中國"域名在技術上符合2003年3月份IETF發布的多語種域名國際標準（RFC3454、RFC3490、RFC3491、RFC3492）。".中國"域名是全球互聯網上代表中國的純中文頂級域名，與.CN域名一樣，同為我國域名體系和全球互聯網域名體系的組成部分，全球通用，具有唯一性。".中國"域名在使用上和.CN域名近似，屬于互聯網上的基礎服務，域名可以提供WWW、EMAIL、FTP等應用服務。

1、中國人自己的域名，便于記憶，易于推廣傳播；

2、中文輸入，符合中國人的使用習慣；

3、全球通用，自動轉碼，繁簡體中文輸入均可等效使用；

4、顯著的中國標識作用，體現自身的價值和定位；

5、全中文服務，適用于中國法律，全面保障用戶利益；

6、域名資源豐富，可以獲得滿意的域名。[4]?

1.4.5.3 域名種類

組織域名

中國的域名體系也遵照國際慣例，包括類別域名和行政區域名兩套。

類別域名是指前面的六個域名，分別依照申請機構的性質依次分為：

ac --- 科研機構

com --- Commercial organizations，工、商、金融等企業

top---工、商、金融等企業

edu --- Educational institutions 教育機構

gov --- Governmental entities政府部門

mil --- Military ，軍事機構

arpa --- Come from ARPANet，由ARPANET(美國國防部高級研究計劃局建立的計算機網）沿留的名稱，被用于互聯網內部功能

net --- Network operations and service centers，互聯網絡、接入網絡的信息中心（NIC)和運行中心（NOC)

org --- Other organizations，各種非盈利性的組織

biz --- web business guide網絡商務向導，適用于商業公司（注：biz是business的習慣縮用）

info --- infomation，提供信息服務的企業

pro --- professional，適用于醫生、律師、會計師等專業人員的通用頂級域名

name--- name，適用于個人注冊的通用頂級域名

coop --- cooperation，適用于商業合作社的專用頂級域名

aero --- aero，適用于航空運輸業的專用頂級域名

museum --- museum，適用于博物館的專用頂級域名

mobi --- 適用于手機網絡的域名

asia --- 適用于亞洲地區的域名

tel --- 適用于電話方面的域名

int --- International organizations，國際組織

cc --- 原是島國“Cocos (Keeling) Islands”的縮寫，但也可把它看成“Commercial Company”（商業公司）的縮寫，所以現已開放為全球性國際頂級域名，主要應用在商業領域內。簡短，容易記憶，漂亮，容易輸入，是新一代域名的新秀

tv --- 原是太平洋島國圖瓦盧“Tuvalu”的國家代碼頂級域名，但因為它也是“television”（電視）的縮寫，主要應用在：視聽、電影、電視等全球無線電與廣播電臺領域內。

us --- 類型表示美國，全球注冊量排名第二

travel --- 旅游域名，國際域名

xxx --- 用于成人網站

idv --- 用于個人

行政區域名是按照中國的各個行政區劃劃分而成的，其劃分標準依照原國家技術監督局發布的國家標準而定，包括“行政區域名”34個，適用于中國的各省、自治區、直轄市。

1.4.5.4 域名的幾點釋疑

ip地址和域名地址有什么關系？

ip地址和域名相當于姓名和別名的關系，但也不盡是。任何一個域名都對應一個或者多個ip地址，大部分都是一個域名對應一個ip地址，由于ip地址不好記錄，所以人們為了更好的找到一個網站，想出了給ip地址起個別名，就是域名，但是一個ip上可以有上千甚至上萬個域名。
互聯網訪問的方式是：輸入域名---域名解析服務器（dns）解析域名成ip地址---訪問ip地址---根據綁定域名找到目錄---達到訪問目的地

國際域名與國內域名有什么區別

1、域名后綴只是一個國家的標記標識，只要互聯網線路通域名都能訪問；比如我們看.TW,.hk,.kr,.jp的域名，只要語言顯示上支持完全一樣訪問；
2、現在網絡公司域名國際國內都是一樣價格，如果說國內貴，完全是騙你；
3、國內域名優勢：
A、一看就知道所訪問的網站所屬國家，比如有些跨國公司在全球很多國家都注冊了公司的域名，一來顯得本地化，本國人都能看，沒有語言限制，二來起保護商標的作用；
B、一旦國際線路不通（比如中美海底電纜中斷，這種可能性比較小）國際域名因根服務器（域名服務器）線路問題不能在國內正常訪問，國內的在國內國外都沒有問題；
C、國內域名管理在CNNIC，國際域名在美國管理；
4、域名注冊原則有簡單易記，富有含義，或者有影響力；域名注冊出著名商標有優先注冊外，一般是先注先得；
5、國際域名注冊的太多，域名資源有限，增加CN域名多了選擇余地
6、如果處于保護品牌的目的可以國際國內都注冊，如果不是保護品牌，可以按自己的意愿注冊--只要還沒有被別人注冊；
7、域名和公司名稱、商標一樣具有唯一性，所以著名品牌都注冊很多域名或同類域名，以免引起糾紛和惡意強注；但一般公司不可能面面具到，所以不一定非看的很重要。
8、COM等是有一定含義的，一般COM通用、GOV政府 EDU教育、ORG非贏利性組織；NET代表網絡，一般商業上選COM CN NET CC ，不過沒有硬性規定（GOV除外）

網址和域名的聯系和區別是什么?

網址是打開網頁的一個地址。常規來說習慣解析www+域名作為一個網站的網址。當然也有解析別的二級域名的網址！域名就是xxx.后綴
這樣可以理解嗎？你可以理解為網址是在域名基礎上解析出來的！

1.4.6 服務器

服務器，也稱伺服器，是提供計算服務的設備。由于服務器需要響應服務請求，并進行處理，因此一般來說服務器應具備承擔服務并且保障服務的能力。

服務器的構成包括處理器、硬盤、內存、系統總線等，和通用的計算機架構類似，但是由于需要提供高可靠的服務，因此在處理能力、穩定性、可靠性、安全性、可擴展性、可管理性等方面要求較高。

在網絡環境下，根據服務器提供的服務類型不同，分為文件服務器，數據庫服務器，應用程序服務器，WEB服務器等。

1.4.7 網頁

網頁是構成網站的基本元素，是承載各種網站應用的平臺。通俗地說，您的網站就是由網頁組成的，如果您只有域名和虛擬主機而沒有制作任何網頁的話，您的客戶仍舊無法訪問您的網站。網頁是一個包含HTML標簽的純文本文件，它可以存放在世界某個角落的某一臺計算機中，是萬維網中的一“頁”，是超文本標記語言格式（標準通用標記語言的一個應用，文件擴展名為.html或.htm）。網頁通常用圖像檔來提供圖畫。網頁要通過網頁瀏覽器來閱讀。

1.4.8 主頁

主頁(home page)，也被稱為首頁，是用戶打開瀏覽器時默認打開的網頁，主要包含個人主頁、網站網頁、組織或活動主頁、公司主頁等。?主頁一般是用戶通過搜索引擎訪問一個網站時所看到的首個頁面，用于吸引訪問者的注意，通常也起到登陸頁的作用。在一般情況下，主頁是用戶用于訪問網站其他模塊的媒介，主頁會提供網站的重要頁面及新文章的鏈接，并且常常有一個搜索框供用戶搜索相關信息，大多數作為首頁的文件名是index、default、main或portal加上擴展名。

1.4.9 標記

超文本標記語言（外國語簡稱：HTML）標記標簽通常被稱為HTML標簽，HTML標簽是HTML語言中最基本的單位，HTML標簽是HTML（標準通用標記語言下的一個應用）最重要的組成部分。

HTML標簽的大小寫無關的，例如“主體”<body>跟<BODY>表示的意思是一樣的，推薦使用小寫。

通常標簽由開始標簽和結束標簽構成，<標簽名>稱為開始標簽,</標簽名>稱為結束標簽,每個標簽都規定好了特殊的含義。

1.4.10 元素

元素是指包含標簽在內的全部，如<標簽名>內容</標簽名>。HTML（標準通用標記語言下的一個應用）元素指的是從開始標簽（start tag）到結束標簽（end tag）的所有代碼。

1.4.11 內容

元素中除去標簽的部分叫做內容。

1.4.12 屬性

也叫標簽，是給每一個標簽所做的輔助信息,如顏色大小粗細等，要在開始標簽中指定。具有屬性名和屬性值，屬性值要用引號引起來。

1.4.13 Xhtml

Xhtml(Extensible Hyper Text Markup Language 可擴展超文本標記語言)，符合XML語法標準的HTML

1.4.14 http：（HyperText Transfer Protocol超文本傳輸協議）

它用于傳送WWW方式的數據，關于HTTP協議的詳細內容請參考RFC2616。HTTP協議采用了請求/響應模型。客戶端向服務器發送一個請求，請求頭包含請求的方法、URL、協議版本、以及包含請求修飾符、客戶信息和內容的類似于MIME的消息結構。服務器以一個狀態行作為響應，響應的內容包括消息協議的版本，成功或者錯誤編碼加上包含服務器信息、實體元信息以及可能的實體內容。

通常HTTP消息包括客戶機向服務器的請求消息和服務器向客戶機的響應消息。這兩種類型的消息由一個起始行，一個或者多個頭域，一個指示頭域結束的空行和可選的消息體組成。HTTP的頭域包括通用頭，請求頭，響應頭和實體頭四個部分。每個頭域由一個域名，冒號（:）和域值三部分組成。域名是大小寫無關的，域值前可以添加任何數量的空格符，頭域可以被擴展為多行，在每行開始處，使用至少一個空格或制表符。簡單來說它是一個協議標準,用來規定客戶端瀏覽器和服務端交互時數據的一個格式

1.4.15 SMTP：（Simple Mail Transfer Protocol簡單郵件傳輸協議）

它是一組用于由源地址到目的地址傳送郵件的規則，由它來控制信件的中轉方式。SMTP協議屬于TCP/IP協議簇，它幫助每臺計算機在發送或中轉信件時找到下一個目的地。通過SMTP協議所指定的服務器,就可以把E-mail寄到收信人的服務器上了，整個過程只要幾分鐘。SMTP服務器則是遵循SMTP協議的發送郵件服務器，用來發送或中轉發出的電子郵件。

1.4.16 FTP：（File Transfer Protocol文件傳輸協議）

用于Internet上的控制文件的雙向傳輸。同時，它也是一個應用程序（Application）。基于不同的操作系統有不同的FTP應用程序，而所有這些應用程序都遵守同一種協議以傳輸文件。在FTP的使用當中，用戶經常遇到兩個概念："下載"（Download）和"上傳"（Upload）。"下載"文件就是從遠程主機拷貝文件至自己的計算機上；"上傳"文件就是將文件從自己的計算機中拷貝至遠程主機上。用Internet語言來說，用戶可通過客戶機程序向（從）遠程主機上傳（下載）文件。

1.4.17 URL（Uniform Resource Locator 統一資源定位符）

統一資源定位符是對可以從互聯網上得到的資源的位置和訪問方法的一種簡潔的表示，是互聯網上標準資源的地址。互聯網上的每個文件都有一個唯一的URL，它包含的信息指出文件的位置以及瀏覽器應該怎么處理它。

它最初是由蒂姆·伯納斯·李發明用來作為萬維網的地址。現在它已經被萬維網聯盟編制為互聯網標準RFC1738了。

基本URL包含模式（或稱協議）、服務器名稱（或IP地址）、路徑和文件名，如“協議://授權/路徑?查詢”。完整的、帶有授權部分的普通統一資源標志符語法看上去如下：協議://用戶名:密碼@子域名.域名.頂級域名:端口號/目錄/文件名.文件后綴?參數=值#標志

第一部分

模式/協議（scheme）：它告訴瀏覽器如何處理將要打開的文件。最常用的模式是超文本傳輸協議（Hypertext Transfer Protocol，縮寫為HTTP），這個協議可以用來訪問網絡。其他協議如下：

http——超文本傳輸協議資源

https——用安全套接字層傳送的超文本傳輸協議

ftp——文件傳輸協議

mailto——電子郵件地址

ldap——輕型目錄訪問協議搜索

file——當地電腦或網上分享的文件

news——Usenet新聞組

gopher——Gopher協議

telnet——Telnet協議

第二部分

文件所在的服務器的名稱或IP地址，后面是到達這個文件的路徑和文件本身的名稱。服務器的名稱或IP地址后面有時還跟一個冒號和一個端口號。它也可以包含接觸服務器必須的用戶名稱和密碼。路徑部分包含等級結構的路徑定義，一般來說不同部分之間以斜線（/）分隔。詢問部分一般用來傳送對服務器上的數據庫進行動態詢問時所需要的參數。

有時候，URL以斜杠“/”結尾，而沒有給出文件名，在這種情況下，URL引用路徑中最后一個目錄中的默認文件（通常對應于主頁），這個文件常常被稱為 index.html 或 default.htm。[1]?

分類

絕對URL

絕對URL（absolute URL）顯示文件的完整路徑，這意味著絕對URL本身所在的位置與被引用的實際文件的位置無關，

相對URL

相對URL（relative URL）以包含URL本身的文件夾的位置為參考點，描述目標文件夾的位置。如果目標文件與當前頁面（也就是包含URL的頁面）在同一個目錄，那么這個文件的相對URL僅僅是文件名和擴展名，如果目標文件在當前目錄的子目錄中，那么它的相對URL是子目錄名，后面是斜杠，然后是目標文件的文件名和擴展名。

如果要引用文件層次結構中更高層目錄中的文件，那么使用兩個句點和一條斜杠。可以組合和重復使用兩個句點和一條斜杠，從而引用當前文件所在的硬盤上的任何文件，

一般來說，對于同一服務器上的文件，應該總是使用相對URL，它們更容易輸入，而且在將頁面從本地系統轉移到服務器上時更方便，只要每個文件的相對位置保持不變，鏈接就仍然是有效地。

大小寫

統一資源定位符一般是分大小寫的，不過服務器管理員可以確定在回復詢問時大小寫是否被區分。有些服務器在收到不同大小寫的詢問時的回復是相同的。地址結尾的"."號在互聯網的發展初期，訪問一個網站不是單純的輸入這樣DNS服務器才能夠識別。后來，微軟公司在WindowsNT3.51中對其進行了修改，可以自動在DNS查詢時自動增加一個.號，隨后UNIX，NetWare也隨之而跟進，讓服務器可以識別結尾沒有"."的域名。但是，符號"."在現在的網址中仍然可以使用，統一資源定位符的日常使用超文本傳輸協議統一資源定位符將從互聯網獲取信息的四個基本元素包括在一個簡單的地址中。

1.5 HTML的編輯工具

在我們日常工作中用于HTML編輯的工具有很多如

notepad 記事本

Sublime：語法高亮提示，輔以代碼提示.

editplus : 語法高亮顯示

技巧：根據顏色判斷單詞是否出錯。（不是100%）

ultraedit : 根據顏色判斷單詞是否出錯,可以顯示2進制數據.

dw(dreamweaver,專業工具) ?代碼提示.

1.6 HTML的規范

HTML是一個弱勢語言，html 不區分大小寫，為了規范咱們統一全用小寫
html頁面的后綴名是html或者htm(有一些系統不支持后綴名長度超過3個字符，比如dos系統)
標記成對出現，包括開始標記和結束標記 , 如 <head></head>
屬性寫在開始標記中，<font color=“red”></font>
標記如果沒有主體，也可以簡寫為<br/> <hr/>
html 的結構

v?聲明部分。主要作用是用來告訴瀏覽器這個頁面使用的是哪個標準。<!doctype html>是HTML5標準。

v?head部分：不會顯示在頁面上。作用是告訴瀏覽器一些頁面的額外信息。

v?body部分：我們所寫的代碼必須放在此標簽內。

1.7 文檔類型定義DTD

文檔類型定義(Document Type Definition?DTD)是一套為了進行程序間的數據交換而建立的關于標記符的語法規則。它是標準通用標記語言和?可擴展標記語言（XML）1.0版規格的一部分，文檔可根據某種DTD語法規則驗證格式是否符合此規則。文檔類型定義也可用做保證標準通用標記語言、可擴展標記語言文檔格式的合法性，可通過比較文檔和文檔類型定義文件來檢查文檔是否符合規范，元素和標簽使用是否正確。文件實例提供應用程序一個數據交換的格式。使用各類文檔類型定義是為了讓標準通用標記語言、可擴展標記語言文件能符合規定的數據交換標準，因為這樣，不同的公司只需定義好標準文檔類型定義，就都能依文檔類型定義建立文檔實例，并且進行驗證，如此就可以輕易交換數據，防止了實例數據定義不同等原因造成的數據交換障礙，滿足了網絡共享和數據交互。文檔類型定義文件是一個美國信息交換標準代碼文本文件。

2 HTML5

2.1 HTML5出現的緣由

進這些頁面，因此HTML5干脆承認他們是符合規范的。換句話說HTML5是規范制定者對現實的妥協。

2.2 HTML5的優勢

從HTML4.01、XHTML到HTML5，并不是一種革命性的升級，而是一種規范向習慣的妥協，因此HTML5并不會帶給開發者過多的沖擊，開發者會發現從HTML4.01過渡到HTML5非常輕松。但另一方面HTML5也增多了很多非常實用的新功能，這些新功能將吸引開發者投入到HTML5的懷抱。

2.2.1 解決跨瀏覽器問題

2.2.2 部分替代原來的JavaScript

除了這里示范的autofocus可用于自動獲取焦點之外，HTML5還支持其他一些屬性，比如一些輸入校驗的屬性，以前都必須通過JavaScript來完成，但現在都只要一個HTML5屬性即可。

2.2.3 更明確地語義支持

2.2.4 增強了web應用程序的功能

2.3 HTML5的基本結構和語義變化

2.3.1 HTML5的基本結構

對于一份基本的HTML5文檔而言，他總有如下結構：

2.3.2 HTML5的語義變化

3 HTML5中常用的元素與屬性

3.1 HTML5保留的常用元素

3.1.1 基本元素

HTML5\Demo\Demo Base On HTML 5\html_basic_element.html

<h1>自強不息厚德載物</h1><h2>自強不息厚德載物</h2><h3>自強不息厚德載物</h3><h4>自強不息厚德載物</h4><h5>自強不息厚德載物</h5><h6>自強不息厚德載物</h6><hr><span>月薪12000</span><span>月薪17000</span><span>月薪25000</span><br><div>月薪12000</div><div>月薪17000</div><div>月薪25000</div><p>月薪12000</p><p>月薪17000</p><p>月薪25000</p>

3.1.2 文本格式化元素

<sup>：定義上標文本。該標簽可以指定id、class、style等核心屬性，還可以指定onclick等各種事件屬性。
<sub>：定義下標文本。該標簽可以指定id、class、style等核心屬性，還可以指定onclick等各種事件屬性。
<bdo>：定義文本顯示的方向。該標簽可以指定id、class、style等核心屬性，還可以指定onclick等各種事件屬性。除此之外，該標簽也可以指定dir屬性，該屬性值只能是ltr或者rtl。

html_text_formatting_elements.html

<span><b>加粗文本</b></span><br><span><i>斜體文本</i></span><br><span><b><i>粗斜體文本</i></b></span><br><span><em>被強調的文本，實際效果與斜體文本差不多！</em></span><br><big><span>大字號文本</span></big><br><span><strong>加粗文本，實際用法與b差不多</strong></span><br><small><span>小字號文本</span></small><br><div>普通文本<sup>上標文本</sup></div><div>普通文本<strong><sub>下標加粗文本</sub></strong></div><bdo dir="ltr">指定文本從左到右排列</bdo><br><bdo dir="rtl">指定文本從右往左排列</bdo>

3.1.3 語義相關元素

HTML5保留了如下語義相關元素。

<abbr>：用來表示一個縮寫。使用該元素時可指定如下屬性：title，用以指定該縮寫所代表的全稱。
<address>：用于表示一個地址。瀏覽器通常會用斜體字顯示其所包含的內容。
<blockquote>：用于定義一段長的引用文本。瀏覽器會使用縮進的方式顯示這段引用文本。使用本元素可指定如下屬性：cite：該屬性指定該引用文本所引用的網址URL。
<q>：用于定義一段段的引用文本，瀏覽器會為該引用文本添加雙引號。

html_semantically related elements.html

<body><p>倉央嘉措<q cite="http://baike.baidu.com/link?url=lhM4NHvopf_VOqQ3As4r3VMZ-N-sfwV8v7kULzZQX1RqtTAKKfL8O0JH-vvgyMfgRhG4DCIcMjSUyBK74FlhiteRwH8uh0-pLV_mFDW3s5L_sa2s54asSFN0JCHBr116">六世喇嘛</q>高原的一聲嘆息</p><div><blockquote>錦瑟無端五十弦，一弦一柱思華年。<br>莊生曉夢迷蝴蝶，望帝春心托杜鵑。<br>滄海月明珠有淚，藍田日暖玉生煙。<br>此情可待成追憶，只是當時已惘然。</blockquote>是唐朝詩人李商隱的代表作，始終隱藏著一種淡淡的憂傷。讓人無法言說，但又無法釋懷。</div><p><cite>《人民的名義》</cite><cite>《三生三世十里桃花》</cite>是2017年不可多得的好作品。</p><p>簡單Java代碼HelloWorld：<br><code>public class HelloWorld{<br>public static void main(String[] args){<br>System.out.print("哈哈，我會寫代碼了！");<br>}<br>}<br></code></p><pre>public class HelloWorld{public staitc void main(String[] args){System.out.print("哈哈，我又會寫代碼了！");}}</pre><p>六世喇嘛<abbr title="倉央嘉措（藏文：??????????????????；Tshangs-dbyangs-rgya-mtsho1683.03.01－1706.11.15），門巴族，六世喇嘛，法名羅桑仁欽倉央嘉措，西藏歷史上著名的詩人、政治人物。">倉央嘉措</abbr>,倉央嘉措是門巴族人，生于<address>西藏南部門隅納拉山下宇松地區烏堅林村</address>的一戶農奴家庭!</p><p><dfn>HTML</dfn>是一種廣為人知的標記語言！</p><p>可通過輸入如下命令：<br><kbd>list -1</kbd><br>在Linux的Shell窗口查看當前目錄下的所有文件、目錄的詳細信息。</p><p>卓文君與司馬相如私奔后，過起了當壚賣酒的生活，后司馬相如獲封郎官，欲納妾，卓文君傷心之下遂做<cite>《白頭吟》</cite><samp>皚如山上雪，皎若云間月。聞君有兩意，故來相決絕。今日斗酒會，明旦溝水頭。躞蹀御溝上，溝水東西流。凄凄復凄凄，嫁娶不須啼。愿得一心人，白頭不相離。竹竿何裊裊，魚尾何簁簁！男兒重意氣，何用錢刀為！ </samp></p><code>public class HelloWorld{public staitc void main(String[] args){<var>int a = 5</var> ;System.out.print("哈哈，我又會寫代碼了！");}}</code><p>我是一個<del>無業人員</del><ins>就業人員</ins>！</p></body>

3.1.4 超鏈接和錨點

<a href="http://imgsrc.baidu.com/forum/pic/item/4ec2d5628535e5dd55d2464876c6a7efcf1b62af.jpg"><b>點擊查看圖片</b></a><br><a href="http://imgsrc.baidu.com/forum/pic/item/4ec2d5628535e5dd55d2464876c6a7efcf1b62af.jpg" target="_blank"><em>點擊獲取圖片</em></a><br><a href="http://imgsrc.baidu.com/forum/pic/item/4ec2d5628535e5dd55d2464876c6a7efcf1b62af.jpg"><img src="2.jpg" width="20" height="20" alt="當前圖像無法顯示"></a><a href="html5_test1.html"><b>基于相對路徑</b></a>

用瀏覽器瀏覽命名錨點時，該命名錨點不會生成任何顯示內容，我們可以使用如下超鏈接來定位到該命名錨點：

詳見html_semantically related elements.html#anchor

3.1.5 列表相關元素

<ul><li>java從入門到精通</li><li>JavaWeb王者歸來</li><li>瘋狂HTML5、CSS3、JavaScript講義</li></ul><ol start="2" type="1"><li>java從入門到精通</li><li>JavaWeb王者歸來</li><li>瘋狂HTML5、CSS3、JavaScript講義</li></ol><dl><dt>日常閱讀</dt><dd>老子</dd><dd>論語</dd><dd>孟子</dd><dt>學習書籍</dt><dd>java從入門到精通</dd><dd>JavaWeb王者歸來</dd><dd>瘋狂HTML5、CSS3、JavaScript講義</dd></dl>

3.1.6 圖像相關元素

<img src="1.jpg" height="200" width="200" alt="當前圖片無法顯示"><img src="2.jpg" height="200" width="200" alt="當前圖片無法顯示"><br><img src="2.jpg" height="50%" width="50%" usemap="mapname" alt="當前圖片無法顯示"><map name="mapname" id="mapname"><area shape="rect" coords="0,0,100,100" href="http://imgsrc.baidu.com/forum/pic/item/4ec2d5628535e5dd55d2464876c6a7efcf1b62af.jpg" target="_blank"><area shape="circle" coords="200,200,50" href="http://imgsrc.baidu.com/forum/pic/item/4ec2d5628535e5dd55d2464876c6a7efcf1b62af.jpg" target="_blank"></map>

3.1.7 表格相關元素

HTML5保留了定義表格的如下標簽：

3.1.8 框架相關元素

3.2 HTML5新增的通用元素

3.3 HTML5新增的常用元素

3.4 HTML5頭部和元信息

3.5 HTML5新增的拖放API

4.HTML5表單相關元素和屬性

4.1 HTML原有的表單及表單控件

　　HTML5保留了原有的表單及表單控件,并對其進行了功能上的增強.

4.1.1 表單元素

4.1.2 使用input元素

　　input元素是表單控件元素中功能最豐富的,如下幾種輸入元素,都是通過input元素生成的;

?

5.HTML5的多媒體支持

5.1 使用audio和video標簽

<!DOCTYPE html> <html> <head><title>多媒體標記</title> </head> <body> <h2>音頻播放</h2>   <video src="movie.mp4" controls="controls" width="400">對不起,您的瀏覽器暫不支持該標簽</video> <video src="" controls="controls">對不起,您的瀏覽器暫不支持該標簽<source src="movie.mp4" ><source src="movie.ogg" > </video> </body> </html>

5.2 使用JavaScript控制多媒體播放

5.2.1 HTMLAudioElement和HTMLVideoElement支持的方法

5.2.2 HTMLAudioElement和HTMLVideoElement的屬性

<!DOCTYPE html> <html> <head><title>多媒體標記-HTMLAudioElement和HTMLVideoElement的屬性和方法</title><script type="text/javascript">//定義音頻列表var list=["1.mp3","2.mp3","3.mp3","4.mp3","5.mp3"];//定義正在播放的音頻的序列腳標var index = 0;//定義變量作為隨機播放或順序播放的變量var playType;window.onload = function(){//獲取select節點,判斷當前節點時什么播放類型var select = document.getElementById("typeSeq");//當用戶更改下拉菜單時,獲取播放類型 select.onchange = function(){window.playType = select.value;}//當頁面加載第一個音頻文件時,獲取音頻節點var player = document.getElementById("player");//頁面加載的第一個播放文件 player.src=list[index];//播放完后,判斷是什么類型播放,然后決定是隨機獲取播放文件,還是順序獲取 player.onended = function(){//假如是隨機播放,那么隨機獲取播放音頻if(playType == "random"){//獲取隨機腳標 index = Math.floor(Math.random()*list.length);player.src = list[index];// document.write(index+"<br/>");//假如是順序播放 }else{index = ++index%list.length;player.src = list[index];// document.write(index+"<br/>"); }//播放 player.play();}}</script> </head> <body><h2>音樂播放器</h2><select id="typeSeq"><option id="suqence" name="sequence" value="sequence" >順序播放</option><option id="random" name="random" value="random">隨機播放</option></select><audio id="player" controls="controls">對不起,你的瀏覽器不支持audio元素</audio> </body> </html>

5.3 事件監聽

?　　與其他HTML5元素一樣,audio和video元素也會除法一些事件,JavaScript腳本同樣為這些事件綁定了事件監聽器.

5.3.1 事件

5.3.2 監聽器

<!DOCTYPE html> <html> <head><title>多媒體支持--事件監聽器</title> </head> <body><h2>視頻播放</h2><video id="mv" src="movie.mp4" loop="loop">對不起,您的瀏覽器無法識別這些標簽</video><br/><input type="button" name="play" value="播放" id="bn"><span id="detail"></span>秒<script type="text/javascript">var bn = document.getElementById("bn");var mv = document.getElementById("mv");var detail = document.getElementById("detail");//添加ontimeupdate事件 mv.ontimeupdate = function(){detail.innerHTML = mv.currentTime+"/"+mv.duration;}bn.onclick=function(){if(mv.paused){mv.play();bn.value="暫停";}else{mv.pause();bn.value="播放";}}</script> </body> </html>

轉載于:https://www.cnblogs.com/lin-jing/p/6917168.html

總結

以上是生活随笔為你收集整理的DHTML---HTML5的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

Dhtml

上一篇：数据库排行榜｜当 DB-Engines
下一篇：购买手机的注意事项