jQuery中unwrap()方法用法实例


Posted in Javascript onJanuary 16, 2015

本文实例讲述了jQuery中unwrap()方法用法。分享给大家供大家参考。具体分析如下:

此方法将移除匹配元素的父元素。

从方法的字面意思可以看出是清除wrap()方法的效果。

语法:

$(selector).unwrap()

实例代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<meta name="author" content="https://3water.com/" />

<head>

<title>三水点靠木</title>

<style type="text/css">

    div

    {

        width:200px;

        height:200px;

        border:1px solid blue;

    }

    p

    {

        width:150px;

        height:150px;

        border:1px solid red;

    }

</style>

<script type="text/javascript" src="jquery/1.4.4/jquery.min.js"></script>

<script type="text/javascript">

    $(document).ready(function(){

        $("button").click(function(){

            $("p").unwrap();

        });

    });

</script>

</head>

<body>

    <div>

       <p>我是p元素</p>

    </div>

    <button>用div包裹每个段落</button>

</body>

</html>

以上代码能够移除p元素的父元素。

希望本文所述对大家的jQuery程序设计有所帮助。

本文转自:蚂蚁部落http://www.softwhy.com/

Javascript 相关文章推荐
IE本地存储userdata的一个bug说明
Jul 01 Javascript
jquery中实现标签切换效果的代码
Mar 01 Javascript
JavaScript的Module模式编程深入分析
Aug 13 Javascript
js实现屏幕自适应局部代码分享
Jan 30 Javascript
图片旋转、鼠标滚轮缩放、镜像、切换图片js代码
Dec 13 Javascript
深入理解angularjs过滤器
May 25 Javascript
jquery网页日历显示控件calendar3.1使用详解
Nov 24 Javascript
bootstrap 下拉多选框进行多选传值问题代码分析
Feb 14 Javascript
BootStrap表单时间选择器详解
May 09 Javascript
vuejs实现ready函数加载完之后执行某个函数的方法
Aug 31 Javascript
javaScript把其它类型转换为Number类型
Oct 13 Javascript
微信小程序实现转盘抽奖
Sep 21 Javascript
jquery搜索框效果实现方法
Jan 16 #Javascript
js表头排序实现方法
Jan 16 #Javascript
js计算任意值之间随机数的方法
Jan 16 #Javascript
jquery事件preventDefault()方法用法实例
Jan 16 #Javascript
jQuery老黄历完整实现方法
Jan 16 #Javascript
jquery中one()方法的用法实例
Jan 16 #Javascript
jquery中show()、hide()和toggle()用法实例
Jan 15 #Javascript
You might like
Mysql中limit的用法方法详解与注意事项
2008/04/19 PHP
Yii2框架BootStrap样式的深入理解
2016/11/07 PHP
PHP环境搭建(php+Apache+mysql)
2016/11/14 PHP
Laravel利用gulp如何构建前端资源详解
2018/06/03 PHP
php使用pthreads v3多线程实现抓取新浪新闻信息操作示例
2020/02/21 PHP
php使用gearman进行任务分发操作实例详解
2020/02/26 PHP
js模拟滚动条(横向竖向)
2013/02/22 Javascript
关于jquery.validate1.9.0前台验证的使用介绍
2013/04/26 Javascript
JavaScript instanceof 的使用方法示例介绍
2013/10/23 Javascript
JS+CSS实现简单的二级下拉导航菜单效果
2015/09/21 Javascript
jQuery中的ready函数与window.onload谁先执行
2016/06/21 Javascript
javascript prototype原型详解(比较基础)
2016/12/26 Javascript
老生常谈combobox和combotree模糊查询
2017/04/17 Javascript
Node.js环境下Koa2添加travis ci持续集成工具的方法
2017/06/19 Javascript
详解javascript对数组和json数组的操作
2019/04/15 Javascript
详解如何实现Element树形控件Tree在懒加载模式下的动态更新
2019/04/25 Javascript
用js编写留言板
2020/03/17 Javascript
Python continue语句用法实例
2014/03/11 Python
python基础教程之数字处理(math)模块详解
2014/03/25 Python
用Python生成器实现微线程编程的教程
2015/04/13 Python
Python基于sftp及rsa密匙实现远程拷贝文件的方法
2016/09/21 Python
python引入导入自定义模块和外部文件的实例
2017/07/24 Python
Python饼状图的绘制实例
2019/01/15 Python
python3 实现调用串口功能
2019/12/26 Python
关于pytorch中全连接神经网络搭建两种模式详解
2020/01/14 Python
基于tensorflow指定GPU运行及GPU资源分配的几种方式小结
2020/02/03 Python
Python HTMLTestRunner测试报告view按钮失效解决方案
2020/05/25 Python
使用pycharm和pylint检查python代码规范操作
2020/06/09 Python
CSS3中的opacity属性使用教程
2015/08/19 HTML / CSS
澳大利亚婴儿礼品公司:The Baby Gift Company
2018/11/04 全球购物
巴西箱包、背包、钱包和旅行配件购物网站:Inovathi
2019/12/14 全球购物
编写一子程序,将一链表倒序,即使链表表尾变表头,表头变表尾
2016/02/10 面试题
酒店应聘自荐信
2013/11/09 职场文书
拾金不昧感谢信范文
2015/01/21 职场文书
七年级地理教学计划
2015/01/22 职场文书
八一建军节主持词
2015/07/01 职场文书