1. 程式人生 > 其它 >前端學習(十一)——HTML5中指令碼、URL及XHTML的簡單學習

前端學習(十一)——HTML5中指令碼、URL及XHTML的簡單學習

技術標籤:前端學習(HTML5+CSS3+JavaScript)

1.HTML指令碼

JavaScript 使 HTML 頁面具有更強的動態和互動性。

1.1<script> 標籤

<script> 標籤用於定義客戶端指令碼,比如 JavaScript。

<script> 元素既可包含指令碼語句,也可通過 src 屬性指向外部指令碼檔案。

JavaScript 最常用於圖片操作、表單驗證以及內容動態更新。

下面的指令碼會向瀏覽器輸出"Hello World!":

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>HTML簡單學習</title>
	</head>
	
	<body>
		<script>
			document.write("Hello World!!!")
		</script>
	</body>
</html>

1.2<noscript> 標籤

<noscript> 標籤提供無法使用指令碼時的替代內容,比方在瀏覽器禁用指令碼時,或瀏覽器不支援客戶端指令碼時。

<noscript>元素可包含普通 HTML 頁面的 body 元素中能夠找到的所有元素。

只有在瀏覽器不支援指令碼或者禁用指令碼時,才會顯示 <noscript> 元素中的內容:

<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<title>HTML簡單學習</title>
	</head>
	
	<body>
		<script>
			document.write("Hello World!!!")
		</script>
		<noscript>抱歉,您的瀏覽器不支援JavaScript!!!</noscript>
		<p>
			不支援 JavaScript 的瀏覽器會使用&nbsp;&lt;noscript&gt;&nbsp;元素中定義的內容(文字)來替代。
		</p>
	</body>
</html>


2.HTML中的URL

URL:統一資源定位器(Uniform Resource Locators)。

Web瀏覽器通過URL從Web伺服器請求頁面。

當您點選 HTML 頁面中的某個連結時,對應的 <a> 標籤指向全球資訊網上的一個地址。

一個統一資源定位器(URL) 用於定位全球資訊網上的文件。

scheme://host.domain:port/path/filename

說明:

  • scheme - 定義因特網服務的型別。最常見的型別是 http
  • host - 定義域主機(http 的預設主機是 www)
  • domain - 定義因特網域名,比如 baidu.com
  • port - 定義主機上的埠號(http 的預設埠號是 80)
  • path - 定義伺服器上的路徑(如果省略,則文件必須位於網站的根目錄中)。
  • filename - 定義文件/資源的名稱

2.1常見的 URL Scheme

Scheme訪問用於...
http超文字傳輸協議以 http:// 開頭的普通網頁。不加密。
https安全超文字傳輸協議安全網頁,加密所有資訊交換。
ftp檔案傳輸協議用於將檔案下載或上傳至網站。
file您計算機上的檔案。

2.2 URL字元編碼

URL 只能使用ASCII 字符集.

來通過因特網進行傳送。由於 URL 常常會包含 ASCII 集合之外的字元,URL 必須轉換為有效的 ASCII 格式。

URL 編碼使用 "%" 其後跟隨兩位的十六進位制數來替換非 ASCII 字元。

URL 不能包含空格。URL 編碼通常使用 + 來替換空格。


3.XHTML簡介

XHTML 是以 XML 格式編寫的 HTML。

3.1 什麼是XHTML?

  • XHTML 指的是可擴充套件超文字標記語言
  • XHTML 與 HTML 4.01 幾乎是相同的
  • XHTML 是更嚴格更純淨的 HTML 版本
  • XHTML 是以 XML 應用的方式定義的 HTML
  • XHTML 是2001 年 1 月釋出的 W3C 推薦標準
  • XHTML 得到所有主流瀏覽器的支援

3.2與 HTML 相比最重要的區別

文件結構

  • XHTML DOCTYPE 是強制性的
  • <html> 中的 XML namespace 屬性是強制性的
  • <html>、<head>、<title> 以及 <body> 也是強制性的

元素語法

  • XHTML 元素必須正確巢狀
  • XHTML 元素必須始終關閉
  • XHTML 元素必須小寫
  • XHTML 文件必須有一個根元素

屬性語法

  • XHTML 屬性必須使用小寫
  • XHTML 屬性值必須用引號包圍
  • XHTML 屬性最小化也是禁止的

3.3<!DOCTYPE ....>是強制性的

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta charset="utf-8"/>
		<title>文件標題</title>
	</head>
	
	<body>
		文件內容
	</body>
</html>

3.4XHTML 元素必須合理巢狀

在 XHTML 中,所有的元素都必須互相合理地巢狀,像這樣:

<b><i>粗體和斜體文字</i></b>

3.5XHTML 元素必須有關閉標籤

<p>這是一個段落</p>
<p>這是另外一個段落</p>

3.6空元素必須包含關閉標籤

分行:<br />
水平線: <hr />
圖片: <img src="happy.gif" alt="Happy face" />

3.7XHTML 元素必須是小寫

<body>
<p>這是一個段落</p>
</body>

3.8屬性名稱必須是小寫、加上引號(不允許屬性簡寫)

<table width="100%">

<input checked="checked">
<input readonly="readonly">
<input disabled="disabled">
<option selected="selected">