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 相关文章推荐
js 完美图片新闻轮转效果,腾讯大粤网首页图片轮转改造而来
Nov 21 Javascript
ASP.NET jQuery 实例17 通过使用jQuery validation插件校验ListBox
Feb 03 Javascript
php跨域调用json的例子
Nov 13 Javascript
JQuery的Ajax请求实现局部刷新的简单实例
Feb 11 Javascript
使用jQuery监听DOM元素大小变化
Feb 24 Javascript
使用jQuery.Qrcode插件在客户端动态生成二维码并添加自定义Logo
Sep 01 Javascript
微信小程序(应用号)开发新闻客户端实例
Oct 24 Javascript
通过bootstrap全面学习less
Nov 09 Javascript
jquery dataview数据视图插件使用方法
Dec 23 Javascript
jQuery中table数据的值拷贝和拆分
Mar 19 Javascript
JS实现十字坐标跟随鼠标效果
Dec 25 Javascript
json数据传到前台并解析展示成列表的方法
Aug 06 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
PHP+ajax 无刷新删除数据
2010/02/20 PHP
php设计模式  Command(命令模式)
2011/06/17 PHP
mac下Apache + MySql + PHP搭建网站开发环境
2014/06/02 PHP
php从完整文件路径中分离文件目录和文件名的方法
2015/03/13 PHP
PHP中递归的实现实例详解
2017/11/14 PHP
javascript数组使用调用方法汇总
2007/12/08 Javascript
封装好的js判断操作系统与浏览器代码分享
2015/01/09 Javascript
js实现鼠标悬停图片上时滚动文字说明的方法
2015/02/17 Javascript
jQuery中的ajax async同步和异步详解
2015/09/29 Javascript
基于JS判断iframe是否加载成功的方法(多种浏览器)
2016/05/13 Javascript
gulp-htmlmin压缩html的gulp插件实例代码
2016/06/06 Javascript
jquery+ajax+text文本框实现智能提示完整实例
2016/07/09 Javascript
ES5学习教程之Array对象
2017/04/01 Javascript
jQuery Masonry瀑布流布局神器使用详解
2017/05/25 jQuery
vue2实现数据请求显示loading图
2017/11/28 Javascript
Angular实现的自定义模糊查询、排序及三角箭头标注功能示例
2017/12/28 Javascript
Node.js 利用cheerio制作简单的网页爬虫示例
2018/03/01 Javascript
JavaScript代码实现txt文件的上传预览功能
2018/03/27 Javascript
微信小程序购物车、父子组件传值及calc的注意事项总结
2018/11/14 Javascript
vue store之状态管理模式的详细介绍
2019/06/13 Javascript
通过说明与示例了解js五种设计模式
2019/06/17 Javascript
javascript设计模式 ? 命令模式原理与用法实例分析
2020/04/20 Javascript
Python利用matplotlib.pyplot绘图时如何设置坐标轴刻度
2018/04/09 Python
python3中函数参数的四种简单用法
2018/07/09 Python
python数据结构学习之实现线性表的顺序
2018/09/28 Python
带你认识Django
2019/01/15 Python
python retrying模块的使用方法详解
2019/09/25 Python
Python搭建代理IP池实现检测IP的方法
2019/10/27 Python
iframe在移动端的缩放的示例代码
2018/10/12 HTML / CSS
全球度假村:Club Med
2017/11/27 全球购物
Footshop法国:购买运动鞋
2020/01/19 全球购物
装饰活动策划方案
2014/02/11 职场文书
酒鬼酒广告词
2014/03/21 职场文书
施工协议书范本
2014/04/22 职场文书
小学生2015教师节演讲稿
2015/03/19 职场文书
Opencv中cv2.floodFill算法的使用
2021/06/18 Python