首頁 > web前端 > js教程 > JS、DOM和JQuery之間的關係範例分析_基礎知識

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

WBOY
發布: 2016-05-16 16:53:02
原創
1002 人瀏覽過

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是必要的。因為它讓你了解業界最通用的技術,為將來學習更高階的函式庫打下基礎,並且確實可以很輕鬆地做出許多複雜的效果。

舉個小例子:
複製程式碼 程式碼如下:



相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
最新問題
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板