JQuery创建DOM元素方法解析
创始人
2024-07-15 03:31:09
0

你知道如何创建DOM元素吗,这里向大家描述一下,到目前为止可以看出,jQuery的作者使得$()函数(你的记忆里它只是jQuery()函数的别名而已)足够通用以便履行许多职责,从而避免把一堆全局性的名称引入JavaScript命名空间。

创建DOM元素

到目前为止可以看出,jQuery的作者使得$()函数(你的记忆里它只是jQuery()函数的别名而已)足够通用以便履行许多职责,从而避免把一堆全局性的名称引入JavaScript命名空间。好,还有一个职责需要探讨。

通过给$()函数传递包含HTML标记的字符串,可以即时创建相应的DOM元素。例如,新建段落元素如下所示:

  1. $("

    Hithere!

    ")  
  2.  

但创建无实体的DOM元素(或元素层次结构)不是那么有用。通常,通过这种调用而创建元素层次结构之后,接着利用jQuery的一个DOM操作函数对其进行操作。

请看代码清单1-1的示例。

代码清单1-1即时创建HTML元素

即时创建HTML元素


此代码在文档中建立名为followMe的现有HTML段落元素。在节的脚本块里,建立文档就绪处理程序,利用如下语句把新建的段落元素插入DOM树的现有元素之后:
$("

Hithere!

").insertAfter("#followMe");

结果如图1-2所示。

动态创建和插入DOM元素


在第2章里将研究整套DOM操作函数,你将看到jQuery提供许多方式去操作DOM,以便获取我们想要的任何结构。既然你已经了解jQuery的基本语法,下面请看该库***大的一个特征。
 

【编辑推荐】

  1. JavaScript DOM特性与应用详解
  2. W3C DOM模型用法详解
  3. JavaScript获取HTML DOM节点元素详解
  4. 深入了解JavaScript HTML DOM对象
  5. 解析HTML DOM Checkbox对象的属性和方法

 

 

相关内容

热门资讯

如何允许远程连接到MySQL数... [[277004]]【51CTO.com快译】默认情况下,MySQL服务器仅侦听来自localhos...
如何利用交换机和端口设置来管理... 在网络管理中,总是有些人让管理员头疼。下面我们就将介绍一下一个网管员利用交换机以及端口设置等来进行D...
施耐德电气数据中心整体解决方案... 近日,全球能效管理专家施耐德电气正式启动大型体验活动“能效中国行——2012卡车巡展”,作为该活动的...
Windows恶意软件20年“... 在Windows的早期年代,病毒游走于系统之间,偶尔删除文件(但被删除的文件几乎都是可恢复的),并弹...
20个非常棒的扁平设计免费资源 Apple设备的平面图标PSD免费平板UI 平板UI套件24平图标Freen平板UI套件PSD径向平...
德国电信门户网站可实时显示全球... 德国电信周三推出一个门户网站,直观地实时提供其安装在全球各地的传感器网络检测到的网络攻击状况。该网站...
着眼MAC地址,解救无法享受D... 在安装了DHCP服务器的局域网环境中,每一台工作站在上网之前,都要先从DHCP服务器那里享受到地址动...
为啥国人偏爱 Mybatis,... 关于 SQL 和 ORM 的争论,永远都不会终止,我也一直在思考这个问题。昨天又跟群里的小伙伴进行...