首頁 web前端 html教學 如何正確地在XHTML文件中使用JavaScript和CSS_HTML/Xhtml_網頁製作

如何正確地在XHTML文件中使用JavaScript和CSS_HTML/Xhtml_網頁製作

May 16, 2016 pm 04:43 PM
css javascript xhtml

在越來越多的網站中,XHTML的使用正以很快的速度取代HTML4,但是,目前一些主流瀏覽器對XHTML的支援還不是很好,加上一些網頁製作者對XHTML和HTML4之間的差異理解不夠,使得XHTML在WEB發展上進展緩慢。


XHTML是XML而不是HTML

目前,對XHTML的一個主要誤解是它是HTML的另一個版本。造成此誤解的一個事實是Microsoft Internet Explorer僅支援MIME格式為text/html的XHTML而不是被建議的application/xhtml xml格式。

當一個XHTML頁面被以text/html的MIME格式解析時,它和HTML頁面沒有任何差別,而當它以text/xml或application/xhtml xml的MIME格式解析時,它將遵從嚴格的XML書寫和顯示規則。

正確的XHTML格式是一個XML程序並且在書寫的時候需要按照以下的嚴格規則:

1.字符)

2.註釋標籤()內容中不能包含兩個連續的橫槓(--)

3.包含在註釋標籤()中的內容將被忽略


style和script內容中的問題

style和script標籤內的內容當XHTML被以XML格式(而非HTML格式)解析時將會造成一些不同的差異。

JavaScript中包含了XHTML中不能存在的字元

Javascript的一些特別字元是XHTML的CDATA標籤外不能存在的字元。



注意:上面的範例程式碼並非良好的XHTML格式,因為它使用了XHTML或XML中不允許的標記" "

在style和script內容中使用註釋


熟悉HTML的作者通常了解,將style和script標籤內容放到註釋標籤內,將在瀏覽器中隱藏這些內容,但有些瀏覽器卻無法理解它們。


style和javascript內含有兩個連續的橫槓(--)


在XHTML頁面的JavaScript中使用註解標籤進行處理時產生的另一個問題就是JavaScript中會有出現兩個連續的橫槓(--)的情況:




使用CDATA代替註解


將script標籤內的內容放到CDATA區塊中可以很好地處理註解中出現兩個連續的橫槓的問題,不過這將使得一些低版本的瀏覽器不支援它,因為它們不能理解XML。好在,我們可以透過使用JavaScript中的註解符對CDATA區塊進行註解以達到相容的目的。




建議的xhtml與html相容處理方式 不要在XHTML頁面中直接書寫style和script,一個好的替代方案是使用外部文件來書寫CSS和JavaScript,然後在XHTML中進行引入。 這個推薦方案看起來非常不錯,不管怎樣,它使得頁面從text/html轉變為application/xhtml xml的過程中,至少在接下來的這些年裡不會出現什麼問題。

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

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

AI Clothes Remover

AI Clothes Remover

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

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

vue中怎麼用bootstrap vue中怎麼用bootstrap Apr 07, 2025 pm 11:33 PM

在 Vue.js 中使用 Bootstrap 分為五個步驟:安裝 Bootstrap。在 main.js 中導入 Bootstrap。直接在模板中使用 Bootstrap 組件。可選:自定義樣式。可選:使用插件。

HTML,CSS和JavaScript的角色:核心職責 HTML,CSS和JavaScript的角色:核心職責 Apr 08, 2025 pm 07:05 PM

HTML定義網頁結構,CSS負責樣式和佈局,JavaScript賦予動態交互。三者在網頁開發中各司其職,共同構建豐富多彩的網站。

了解HTML,CSS和JavaScript:初學者指南 了解HTML,CSS和JavaScript:初學者指南 Apr 12, 2025 am 12:02 AM

WebDevelovermentReliesonHtml,CSS和JavaScript:1)HTMLStructuresContent,2)CSSStyleSIT和3)JavaScriptAddSstractivity,形成thebasisofmodernWebemodernWebExexperiences。

bootstrap怎麼設置框架 bootstrap怎麼設置框架 Apr 07, 2025 pm 03:27 PM

要設置 Bootstrap 框架,需要按照以下步驟:1. 通過 CDN 引用 Bootstrap 文件;2. 下載文件並將其託管在自己的服務器上;3. 在 HTML 中包含 Bootstrap 文件;4. 根據需要編譯 Sass/Less;5. 導入定製文件(可選)。設置完成後,即可使用 Bootstrap 的網格系統、組件和样式創建響應式網站和應用程序。

bootstrap怎麼寫分割線 bootstrap怎麼寫分割線 Apr 07, 2025 pm 03:12 PM

創建 Bootstrap 分割線有兩種方法:使用 標籤,可創建水平分割線。使用 CSS border 屬性,可創建自定義樣式的分割線。

bootstrap怎麼插入圖片 bootstrap怎麼插入圖片 Apr 07, 2025 pm 03:30 PM

在 Bootstrap 中插入圖片有以下幾種方法:直接插入圖片,使用 HTML 的 img 標籤。使用 Bootstrap 圖像組件,可以提供響應式圖片和更多樣式。設置圖片大小,使用 img-fluid 類可以使圖片自適應。設置邊框,使用 img-bordered 類。設置圓角,使用 img-rounded 類。設置陰影,使用 shadow 類。調整圖片大小和位置,使用 CSS 樣式。使用背景圖片,使用 background-image CSS 屬性。

bootstrap按鈕怎麼用 bootstrap按鈕怎麼用 Apr 07, 2025 pm 03:09 PM

如何使用 Bootstrap 按鈕?引入 Bootstrap CSS創建按鈕元素並添加 Bootstrap 按鈕類添加按鈕文本

bootstrap怎麼調整大小 bootstrap怎麼調整大小 Apr 07, 2025 pm 03:18 PM

要調整 Bootstrap 中元素大小,可以使用尺寸類,具體包括:調整寬度:.col-、.w-、.mw-調整高度:.h-、.min-h-、.max-h-

See all articles