jQuery拼接HTML标签元素
1. append & appendTo 的功能均为:在被选元素结尾(仍在元素内部)插入指定内容,但是内容和选择器的位置不同
(1) append()方法:
//在id为element元素内部末尾插入<p>拼接的元素</p>
$("#element").append("<p>拼接的元素</p>");
(2) appendTo()方法:
//在id为element元素内部末尾插入<p>拼接的元素</p>
$("<p>拼接的元素</p>").appendTo("#element");
2. insertBefore & before & insertAfter & after
(1) insertBefore() & before() 方法 :在被选元素前(元素外部)插入指定内容
//在id为element的元素前插入<p>拼接的元素</p>
$("<p>拼接的元素</p>").insertBefore("#element");
注:如果指定内容是已存在的元素,它将从它的当前位置被移除,并被插入在被选元素之前。
//在id为element的元素前插入<p>拼接的元素</p>
$("#element").before("<p>拼接的元素</p>");
(2) insertAfter() & after()方法:在被选元素后(元素外部)插入指定内容
//在id为element的元素后插入<p>拼接的元素</p>
$("<p>拼接的元素</p>").insertAfter("#element");
注:如果指定内容是已存在的元素,它将从它的当前位置被移除,并被插入在被选元素之后。
//在id为element的元素后插入<p>拼接的元素</p>
$("#element").after("<p>拼接的元素</p>");
jQuery拼接HTML标签元素的更多相关文章
- jQuery中 对标签元素操作(2)
一.属性操作 1.获取属性和设置属性 例如下jQuery代码: var $para=$("p"); //获取<p>节点 var p_txt=$par ...
- jQuery中 对标签元素操作(1)
一:创建元素节点(添加) 创建元素节点并且把节点作为元素的子节点添加到DOM树上 append(): 在元素下添加元素 用法:$("id").append(" ...
- jQuery基础之获取和设置标签元素属性
jQuery基础之获取和设置标签元素属性方法,如下图: 代码实现: <script src="JS/jquery-1.12.4.min.js"></script& ...
- jquery 选择器(name,属性,元素)大全
jQuery 选择器大体上可分为:基本选择器.层次选择器.过滤选择器.表单选择器. 其中过滤选择器可以分为:简单过滤选择器.内容过滤选择器.可见性过滤选择器.属性过滤选择器.子元素过滤选择器.表单对象 ...
- jQuery中常用的元素查找方法
$("#myELement") 选择id值等于myElement的元素,id值不能重复在文档中只能有一个id值是myElement所以得到的是唯一的元素 $("div&q ...
- 浅析jQuery中常用的元素查找方法总结
本篇文章是对jQuery中常用的元素查找方法进行了详细的总结和介绍,需要的朋友参考下 $("#myELement") 选择id值等于myElement的元素,id值不能重复在文 ...
- [jQuery]无法获取隐藏元素(display:none)宽度(width)和高度(height)的新解决方案
在做茶城网改版工作的时候,又遇到一个新问题,我需要用jQuery写一个通过点击左右图标来翻阅图片的小插件,写好后测试可以正常运行,但是放到Tab中后发现只有第一个Tab中的代码能够正常运行,其它全部罢 ...
- jQuery选取和操纵元素的特点
jQuery选取和操纵元素的特点 JavaScript选取元素 先来看看不用jQuery的时候我们是怎么处理元素选取的. JavaScript选取元素的时候,可以根据id获取元素,当id不存在的时候, ...
- jquery动态添加的元素不能直接应用事件方法的时候
对于由 jQuery 动态生成的元素,如用 jQuery 给元素添加 class,或者直接添加一对 p 标签,不能直接绑定常用的事件,如 click.因为这些元素属于动态生成,除非采用 onclick ...
随机推荐
- Tea for Mac(mac笔记软件)中文版
为大家分享一款好用且免费的mac笔记软件,Tea for Mac提供了实时渲染的Markdown,功能全面,支持各种快捷键,使用tea mac版时,在段首打@即可快速插入图片.标题.列表等元素,非常便 ...
- NABCD分析---校园服务
N(需求): 大学生活中,很多琐碎的小事浪费同学时间精力.我们的APP本着为同学服务的宗旨,解决生活中各方面的问题,同学们可以在APP上发布各种信息,例如兼职,二手买卖等等. A(做法): 用户打开A ...
- Mac截图操作,自定义快捷键
选择system preferences 下面能看到系统定义的快捷键,可以自己修改
- webpack基础小结。
想写写webpack的学习体验的小结,加深自己的理解和使用技能,顺便过一下文档(4.0的功能感觉还是满好玩的). 本文主简写描述webpack中对各种文件的简单处理 基本知识点 处理js 加载css文 ...
- 一起ORA-00028案例的处理过程
前言 最近客户在测试新系统A时,遭遇ORA28,回话被终止的问题. 先了解一下大致环境,系统A由系统B通过rman还原恢复,应用程序已经在系统B跑批通过,现在系统A上遇到下面问题. 应用程序报错如下 ...
- windows----------Windows10 远程桌面连接失败,报CredSSP加密oracle修正错误解决办法
1.通过运行gpedit.msc进入组策略配置(需要win10专业版,家庭版无解),策略路径:“计算机配置”->“管理模板”->“系统”->“凭据分配”,设置名称: 加密 Oracl ...
- C#中类成员的执行顺序
先进行细分: 类的成员分为:字段.属性.方法.构造方法 成员的修饰符:静态成员.实例成员 层次结构:父类.子类 先不考虑继承关系,执行顺序为: 静态字段静态构造方法实例字段实例构造方法属性和方法是在调 ...
- jquery的输入框自动补全功能+ajax
jquery的输入框自动补全功能+ajax 2017年05月10日 18:51:39 辣姐什么鬼 阅读数:1461 标签: web前端 更多 个人分类: web前端 内容参考网友文章写成,原博的链 ...
- 安装Oracle Grid的过程中用到的几个小技巧
1.利用文件来模拟块设备 在grid的安装教程中有一步是 provision the disk devices for use with ASM Filter Driver.但是如果我们没有多个磁盘怎 ...
- Beyond Compare相同文件为何显示差异
原文地址: http://www.beyondcompare.cc/wenti/wenjian-chayi.html Beyond Compare是一款经典老牌且优秀的专业级文本比较工具,它可以很方便 ...