JS、DOM和JQuery之間的關係範例分析_基礎知識

DOM(document object model) 其實是瀏覽器內元素物件的一個總稱

我們用JavaScript對網頁進行的所有操作都是透過DOM進行的。 DOM屬於瀏覽器，而不是JavaScript語言規範裡的規定的核心內容，所以如果你下載一個JavaScript語言的參考幫助文檔來查的話，就連婦孺皆知的document.write方法也找不到。

文件物件模型（Document Object Model，DOM）是一種用於HTML和XML文件的程式設計介面。它給了文件一種結構化的表示方法，可以改變文件的內容和呈現方式。我們最關心的是，DOM把網頁和腳本以及其他的程式語言連結了起來。腳本開發人員可以透過文件物件的屬性、方法和事件來掌控、操縱和建立動態的網頁元素。每一個網頁元素（一個HTML標籤）都對應著一個物件（object，所謂“物件”，用白話說就是“東西”。object這個字在台灣通常翻譯成“物件”）。網頁上的標籤是一層層嵌套的，最外面的一層是，文檔物件模型也這樣一層層嵌套著，但是通常被理解成一棵樹的形狀。樹根是window或document對象，相當於最外層的標籤的外圍，也就是整個文件。

舉個小例子：

複製程式碼 程式碼如下:

var x = document.getElementById("test");
var xc = x.childNodes;
var xcl = xc.length;
for(var i=0;idocument.write("nodeName = " xc[i].nodeName "; nodeType = " xc[i].nodeType "
");}

javascript是可對DOM進行操作的，例如:一個是一個DOM物件,javascript可以對其添加,刪除,等操作.

很多人看到Java 和JavaScript 都有「Java」四個字，就以為它們是同一樣東西，連我自己當初也是這樣。其實它們是完完全全不同的兩種東西。 Java，全名應該是 Java Applet，是嵌在網頁中，而有自己獨立的運行視窗的小程式。 Java Applet 是預先編譯好的，一個 Applet 檔案（.class）用 Notepad 打開閱讀，根本無法理解。 Java Applet 的功能很強大，可以存取 http、ftp等協議，甚至可以在電腦上種病毒（已有先例了）。相較之下，JavaScript 的能力就比較小了。 JavaScript 是一種「腳本」（「Script」），它直接把程式碼寫到 HTML 文件中，瀏覽器讀取它們的時候才進行編譯、執行，所以能查看 HTML 原始檔就能查看JavaScript 原始碼。 JavaScript 沒有獨立的運行窗口，瀏覽器目前窗口就是它的運行窗口。它們的相同點，我想只有同是以 Java 作程式語言一點了。 JavaScript是一種基於物件和事件驅動並具有相對安全性的客戶端腳本語言。同時也是廣泛用於客戶端Web開發的腳本語言，常用於為HTML網頁添加動態功能，例如回應使用者的各種操作。

舉個小例子：

複製程式碼 代碼如下:

var🎜> myVariable="outside";
function myFunction(){
var myVariable="inside";
alert(myVariable);
}
myFunction();
alert(Variable) ;

jquery是所謂的javascript的框架,其實就是javacript函數的集合,打包。

Jquery是繼prototype之後又一個優秀的Javascrīpt框架。它是輕量級的js庫(壓縮後只有21k) ，它相容於CSS3，也相容於各種瀏覽器（IE 6.0 , FF1.5 , Safari 2.0 , Opera 9.0 ）。 jQuery讓用戶能更方便地處理HTML documents、events、實作動畫效果，並且方便地為網站提供AJAX互動。 jQuery還有一個比較大的優點是，它的文件說明很全，而且各種應用也說得很詳細，同時還有許多成熟的插件可供選擇。 jQuery能夠讓使用者的html頁保持程式碼和html內容分離，也就是說，不用再在html裡面插入一堆js來呼叫指令了，只要定義id即可。

jQuery是目前使用最廣泛的javascript函數函式庫。根據統計，全世界排名前100萬的網站，有46%使用jQuery，遠超過其他函式庫。微軟公司甚至把jQuery當作他們的官方函式庫。對網頁開發者來說，學會jQuery是必要的。因為它讓你了解業界最通用的技術，為將來學習更高階的函式庫打下基礎，並且確實可以很輕鬆地做出許多複雜的效果。

舉個小例子：

複製程式碼 程式碼如下: