JQuery創(chuàng)建DOM元素方法解析
你知道如何創(chuàng)建DOM元素嗎,這里向大家描述一下,到目前為止可以看出,jQuery的作者使得$()函數(shù)(你的記憶里它只是jQuery()函數(shù)的別名而已)足夠通用以便履行許多職責(zé),從而避免把一堆全局性的名稱引入JavaScript命名空間。
創(chuàng)建DOM元素
到目前為止可以看出,jQuery的作者使得$()函數(shù)(你的記憶里它只是jQuery()函數(shù)的別名而已)足夠通用以便履行許多職責(zé),從而避免把一堆全局性的名稱引入JavaScript命名空間。好,還有一個(gè)職責(zé)需要探討。
通過給$()函數(shù)傳遞包含HTML標(biāo)記的字符串,可以即時(shí)創(chuàng)建相應(yīng)的DOM元素。例如,新建段落元素如下所示:
- $("<p>Hithere!</p>")
但創(chuàng)建無實(shí)體的DOM元素(或元素層次結(jié)構(gòu))不是那么有用。通常,通過這種調(diào)用而創(chuàng)建元素層次結(jié)構(gòu)之后,接著利用jQuery的一個(gè)DOM操作函數(shù)對(duì)其進(jìn)行操作。
請(qǐng)看代碼清單1-1的示例。
代碼清單1-1即時(shí)創(chuàng)建HTML元素
此代碼在文檔<body>中建立名為followMe的現(xiàn)有HTML段落元素。在<head>節(jié)的腳本塊里,建立文檔就緒處理程序,利用如下語句把新建的段落元素插入DOM樹的現(xiàn)有元素之后:
$("<p>Hithere!</p>").insertAfter("#followMe");
結(jié)果如圖1-2所示。
在第2章里將研究整套DOM操作函數(shù),你將看到j(luò)Query提供許多方式去操作DOM,以便獲取我們想要的任何結(jié)構(gòu)。既然你已經(jīng)了解jQuery的基本語法,下面請(qǐng)看該庫(kù)***大的一個(gè)特征。
【編輯推薦】
- JavaScript DOM特性與應(yīng)用詳解
- W3C DOM模型用法詳解
- JavaScript獲取HTML DOM節(jié)點(diǎn)元素詳解
- 深入了解JavaScript HTML DOM對(duì)象
- 解析HTML DOM Checkbox對(duì)象的屬性和方法