jQuery 如何先创建、再修改、后添加DOM元素
例如顺序执行【创建】-> 【修改】-> 【添加】三个动作。
由于jQuery支持链式操作,其实就是设计模式的builder模式,所以我们可以把三个操作串在一起来执行。
首先创建一个p元素,内容包含一个a元素。
然后为a元素添加一个href属性
最后把新添加的p元素添加到body中
注意,这个地方需要执行end()操作,否则添加到body中的元素不是p元素变成了p元素中的a元素。
其实,end()操作不能等价与撤销,它返回的是previous selection,但是这个selection已经被end之前的操作修改过。
<html>
<head>
<meta charset="UTF-8">
</head>
<body>
<script type="text/javascript" src="jquery-1.11.1.js"></script>
<script type="text/javascript">
$('<p><a>jQuery</a></p>').find('a').attr('href', 'http://www.jqeury.com').appendTo('body');
</script>
</body>
</html>
jQuery 如何先创建、再修改、后添加DOM元素的更多相关文章
- IntelliJ IDEA 创建web项目后添加Java EE (Tomcat)的依赖包
本文讲述的是IntelliJ IDEA 12版本 如果在编译器中创建一个web项目后,没有设置tomcat的依赖包,就不能成功的编译,会缺少javax.servlet.*等类. 添加的方法是: 打开p ...
- VS2015创建类库项目后添加不了WPF资源字典,窗口,用户控件处理办法
打开项目工程文件在PropertyGroup标签最后加上下面3行: <ProjectTypeGuids>{60dc8134-eba5-43b8-bcc9-bb4bc16c2548};{FA ...
- VS2017创建类库项目后添加不了WPF资源字典
第一步: 先找到你需要添加的库类工程文件,位置如下: 第二步: 使用记事本文件打开,找到图片的位置,把三行代码粘贴进去,保存文件.重新打开项目: 三行代码如下: <ProjectTypeGuid ...
- 当使用listIterator进行迭代时候 list的迭代器可以在创建迭代器对象后 添加数据 但打印的时候不显示添加后的数据。 collection 的iterator迭代器不能添加数据 。list的对象与collection的实例对象都不能在创建迭代器后添加数据 list的迭代器保存的是循环前的数据长度
- jquery on=>keyup无法绑定未来js添加的元素
$("[name=red_count]").on("keyup", countKeyUpBind);即使使用on的,也无法绑定未来元素, 所以直接在动态添加的时 ...
- createElement创建标签及appendChild添加到元素的后面
var p = document.createElement('p'); var box = document.getElementsByTagName('div')[0]; box.appendCh ...
- JS添加DOM元素CSS权重BUG
修改删除table的时候,比如拆分合并单元格,合并全部TR中的某个TD后在拆分还原,即使直接在td标签中设置了td的高宽属性,当td在css文件中设置为宽度auto的时候,不能显示出TD来,显示TD宽 ...
- 在容器最前面添加DOM元素 parent.insertBefore(new, parent.children[0])
//判断容器当前有没有子级元素,如果没有直接appendChild就行了; if (p.children[0]) { p.insertBefore(span, p.children[0]); } el ...
- jQuery中动态创建、添加元素的方法总结
<input type="button" value="创建元素" id="btn"> <div id="box ...
随机推荐
- SQLite CRUD操作
SQLite CRUD操作代码实例: 1:首先创建一个继承了SQLiteOpenHelper类的MyDatabaseHelper类.实现他的onCreate(SQLiteDatabase db) on ...
- 【转】C#实现二叉查找树
原文URL: http://www.cnblogs.com/CareySon/archive/2012/04/19/ImpleBinaryTreeWithCSharp.html 简介 树是一种非线 ...
- C# DateTimePicker控件详解
1.同时显示日期和时间 DateTimePicker dtp = new DateTimePicker(); dtp.Format = DateTimePickerFormat.Custom;dtp. ...
- CSS笔记——padding,margin为百分比计算时的参照对象
div的padding为百分比的两种情况 padding-top,padding-bottom,margin-top,margin-bottom是百分比时是按照当前元素的父级元素的宽度来计算的 1. ...
- 查看cpu、内存和硬盘
查看cpu cat /proc/cpuinfo 查看内存 top free -m 按兆为单位输出内存的已用,未用,总共等结果 cat /proc/meminfo |grep MemTotal 查看硬盘 ...
- 关于delete
上面三图在debug下,delete的时候会以fe ee覆盖指针所指向要回收内存前后较大一块区域的值. 下图对于release下delete的时候会先用fe ee覆盖指针所指位置起6*4=24字节, ...
- Linux 下cronolog分割catalina.out文件
开发项目的时候查看日志,发现catalina.out已经有1个多G,日积月累的慢慢变大,幸亏及时发现还没有导致错误, tomcat默认日志之一输出在catalina.out文件中的,不会分割,不便于使 ...
- HTML5之 WebSockets
------- 新的网络连接技术 - Web-Sockets 持续连接数据流 全双工工作方式 http补充品而非替代品 - 应用场景 聊天室 股票显示 在线游戏(尤为突出) - 2byte的通信 1b ...
- phpcms v9 源码解析- 2 base.php
base.php在上文已经说过,是在PC中重要的一个文件,基本常量.核心类文件的加载都由它来完成. 9行,定义了一个常量 IN_PHPCMS,在系统的入口定义一个常量,在其他文件就判断是否这个常量被定 ...
- Openvpn完美解决公司网络没有固定公网IP的问题
方案背景: 公司办公网络使用长城宽带上网有一段时间了,有4个固定IP(2个电信,2个网通),链路不太稳定,经常有问题,因此考虑取消长城宽带,采用原来的adsl上网.但是有个问题,因为公司内网有几台服务 ...