jquery-包裹元素
1、wrap方法
在每个匹配的元素外层包上一个html元素
参数类型说明:
1)html字符串
$('p').wrap('<div></div>');
传入的html标签也可以是嵌套多层,但应该只包含一个核心的元素
2)选择器
传入选择器则是将 选中的元素(及其后代) 复制一份用来 包裹对应的元素
3)jQuery对象
可以使用新创建的元素对象或者使用选择器获取到的元素对象
4)html元素对象
5)函数
有多少个匹配元素,这个函数就会执行多少次!
函数接收一个参数
当前元素的序号
函数内部this代表当前的html元素对象
return用于包裹匹配元素的 HTML 内容或 jQuery 对象
2、wrapAll方法
在所有匹配元素外面包一层HTML结构
参数同上,但是我们一般不会传入函数!
注意:如果所匹配的元素没有共同的父元素时的情况
3、wrapInner方法
在匹配元素里的内容外包一层结构
参数同上
<script type="text/javascript">
$(function(){
$("p").wrapAll("<div></div>");
$("a").wrap("<div></div>");
$("p").wrapInner("<h1></h1>");
}
);
</script> <p>段落</p>
<p>段落</p>
<a>链接</a>
<a>链接</a>
jquery-包裹元素的更多相关文章
- js进阶 11-13 jquery如何包裹元素和去除元素外的包裹
js进阶 11-13 jquery如何包裹元素和去除元素外的包裹 一.总结 一句话总结:wrap().wrapAll().unwrap().innerWrap()四个方法 1.jquery中unwr ...
- jQuery 源码解析(二十四) DOM操作模块 包裹元素 详解
本节说一下DOM操作模块里的包裹元素子模块,该模块可将当前匹配的元素替换指定的DOM元素,有如下方法: wrap(html) ;在每个匹配元素的外层添加一层DOM元素 ...
- jQuery包裹节点用法完整示例
本文实例讲述了jQuery包裹节点用法.分享给大家供大家参考,具体如下: <html> <head> <meta http-equiv="Content-Typ ...
- jquery 追加元素/jquery文档处理,插入、修改、移动、删除指定的DOM元素.
jquery 追加元素 $("#content").append("..."); // 添加到元素内部最后面 $("#content").p ...
- 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式
本系列文章导航 从零开始学习jQuery (四) 使用jQuery操作元素的属性与样式 一.摘要 本篇文章讲解如何使用jQuery获取和操作元素的属性和CSS样式. 其中DOM属性和元素属性的区分值得 ...
- 使用 Sticky-Kit 实现基于 jQuery 的元素固定效果
元素固定效果在网页中应用得很多,比较常见的使用场景有改进导航,显示广告.Sticky-Kit 是一个非常方便的 jQuery 插件,简化了创建/管理粘元素,有复杂的使用功能.这些功能包括:处理多个固定 ...
- JQuery判断元素是否存在
JQuery判断元素是否存在的原理与javascript略有不同,因为$选择器选择的元素无论是否存在都不会返回null或undefined,要使用JQuery判断元素是否存在,只能使用length属性 ...
- jQuery入门(2)使用jQuery操作元素的属性与样式
jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...
- jquery检查元素存在性
javascript检查元素存在性: 即使这个元素被删除了,也不担心javascript代码报错: jquery检查元素存在性: 代码如下: if(!document.getElementById(& ...
- jquery 获取元素在浏览器中的绝对位置
代码详解 1,获取对象(自定义调整打开新窗口参照元素) var obj = $("#oButton"); 实例中我获取的对象是弹出窗口按钮,这样创建的新窗口就会根椐按钮的位置进行调 ...
随机推荐
- js获取当前页面url网址等信息
使用js获取当前页面的url网址信息. 1.设置或获取整个 URL 为字符串: window.location.href 2.设置或获取与 URL 关联的端口号码: window.location.p ...
- Android系统框架介绍
src目录:主要是完成java代码的编写 assets目录:资源目录 res目录:存在图片,布局文件和字符串.菜单等文件 bin目录:输出文件夹,如生成的APK文件 project,propertie ...
- 如何使用Redis做MySQL的缓存
应用Redis实现数据的读写,同时利用队列处理器定时将数据写入mysql. 同时要注意避免冲突,在redis启动时去mysql读取所有表键值存入redis中,往redis写数据时,对redis主键自增 ...
- navicat如何导入sql文件和导出sql文件
http://jingyan.baidu.com/article/a65957f4976aad24e67f9b9b.html ************************************* ...
- Python获取时间范围内日期列表和周列表的函数
1.获取日期列表 # -*- coding=utf-8 -*- import datetime def dateRange(beginDate, endDate): dates = [] dt = d ...
- tomcat logs 目录下各日志文件的含义
tomcat每次启动时,自动在logs目录下生产以下日志文件,按照日期自动备份 localhost.2016-07-05.txt //经常用到的文件之一 ,程序异常没有被捕获的时候抛出的地方 ca ...
- 基于jquery右侧悬浮加入购物车代码
分享一款基于jquery右侧悬浮加入购物车代码.这是一款基于jQuery实现的仿天猫右侧悬浮加入购物车菜单代码. 在线预览 源码下载 实现的代码: <!--左侧产品parabola.js控制 ...
- DHCP配置实例
配置DHCP的思路: 1.创建dhcp服务2.添加一个网络号(或者说地址池)3.排除路由器的网管4.排除DHCP的网关 代码: Router>enableRouter#configRouter# ...
- war 宽度变窄
1.打开开始菜单-运行-输入Regedit 打开注册表编辑器 展开 HKEY_CURRENT_USER 继续展开 Software继续展开 Blizzard Entertainment 在Warcra ...
- PDNN: 深度学习的一个Python工具箱
PDNN: 深度学习的一个Python工具箱 PDNN是一个在Theano环境下开发出来的一个Python深度学习工具箱.它由苗亚杰(Yajie Miao)原创.现在仍然在不断努力去丰富它的功能和扩展 ...