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 ...
随机推荐
- jquery-ui sortable 在拖动换位置时改变元素的大小导致占位与实际不一致
使用jquery ui sortable时 需求是在拖动的时候要隐藏一部分元素,然后按照隐藏后的元素高度换位, 解决方案是修改源码jquery-ui.js, _mouseStart方法中开头增加 if ...
- python 选课系统
couser.py: import sys,osBASE_DIR = os.path.dirname(os.path.dirname(os.path.abspath(__file__)))sys.pa ...
- visual studio 中被遗忘的任务列表和书签
任务列表(Task List)是VS中被人遗忘的一个功能,用到跳转到不同的代码段非常不便.以后就不用每次前进和后退导航了. 使用“任务列表” 跟踪使用 TODO 和 HACK或自定义令牌等令牌的代码注 ...
- MySql数据库中,判断表、表字段是否存在,不存在就新增
本文是针对MySql数据库创建的SQL脚本,别搞错咯. 判断表是否存在,不存在就可新增 CREATE TABLE IF NOT EXISTS `mem_cardtype_resource` ( ... ...
- Check SQL Server Deadlock
Sometimes a script keeps running for a long time and can't stop, then a db blocking is occurring. We ...
- es6 遍历总结
1.for in / for of for in --> index是key值 var array = [1,2,3,4,5]; for(let index in array) { consol ...
- JAVA常用加密解密算法Encryption and decryption
加密,是以某种特殊的算法改变原有的信息数据,使得未授权的用户即使获得了已加密的信息,但因不知解密的方法,仍然无法了解信息的内容.大体上分为双向加密和单向加密,而双向加密又分为对称加密和非对称加密(有些 ...
- 工厂方法 Factory Method
背景:有一个应用框架,它可以向用户显示多个文档.在这个框架中,两个主要的抽象是类Application和Document.这两个类都是抽象的.客户必须通过它们的子类来做与举替应用相关的实现. 分析:因 ...
- Ubuntu16.04安装Redis
前言 Redis是常用基于内存的Key-Value数据库,比Memcache更先进,支持多种数据结构,高效,快速.用Redis可以很轻松解决高并发的数据访问问题:作为实时监控信号处理也非常不错. 环境 ...
- ng2
angularjs2的环境问题解决了好久. 百度到的答案也是各种各样还解决不了我的问题. 好在这几天经过不断的测试终于给解决了. ERROR in AppModule is not an NgModu ...