zoukankan      html  css  js  c++  java
  • jquery 包裹元素、元素外插入

    .unwrap()

    将匹配元素集合的父级元素删除,保留自身(和兄弟元素,如果存在)在原来的位置。

    <div class="a">
    	<p>test</p>
    </div>
    <script src="jquery.js"></script>
    <script type="text/javascript">
    $(function(){
    	$('p').unwrap();
    });
    </script>
    

    .wrap()

    在每个匹配的元素外层包上一个html元素。

    <style type="text/css">
    .a{background:#900; 100px; height:100px; margin-top:10px;}
    </style>
    </head>
    <body>
    <p>test</p>
    <script src="jquery.js"></script>
    <script type="text/javascript">
    $(function(){
    	$('p').wrap('<div class="a"></div>');
    });
    </script>
    

    .wrapAll()

    在所有匹配元素外面包一层HTML结构。

    <style type="text/css">
    .a{background:#900; 100px; height:100px; margin-top:10px;}
    </style>
    </head>
    <body>
    <p>test</p>
    <p>test2</p>
    <script src="jquery.js"></script>
    <script type="text/javascript">
    $(function(){
    	$('p').wrapAll('<div class="a"></div>');
    });
    </script>
    

    .wrapInner()

    在匹配元素里的内容外包一层结构。

    <style type="text/css">
    .a{background:#900; 100px; height:100px; margin-top:10px;}
    </style>
    </head>
    <body>
    <p>test</p>
    <p>test2</p>
    <script src="jquery.js"></script>
    <script type="text/javascript">
    $(function(){
    	$('p').wrapInner('<div class="a"></div>');
    });
    </script>
    

    .after()

    在匹配元素集合中的每个元素后面插入参数所指定的内容,作为其兄弟节点。

    <div class="a">1</div>
    <script src="jquery.js"></script>
    <script type="text/javascript">
    $(function(){
        $('.a').after('<p>test2</p>');
    });
    </script>
    

    .before()

    根据参数设定,在匹配元素的前面插入内容(译者注:外部插入)

    <div class="a">1</div>
    <script src="jquery.js"></script>
    <script type="text/javascript">
    $(function(){
    	$('.a').before('<p>test2</p>');
    });
    </script>
    

    .insertAfter()

    在目标元素后面插入集合中每个匹配的元素(注:插入的元素作为目标元素的兄弟元素)。

    <div class="a">1</div>
    <script src="jquery.js"></script>
    <script type="text/javascript">
    $(function(){
        $('<p>test2</p>').insertAfter('.a');
    });
    </script>
    

    .insertBefore()

    在目标元素前面插入集合中每个匹配的元素(注:插入的元素作为目标元素的兄弟元素)。

    <div class="a">1</div>
    <script src="jquery.js"></script>
    <script type="text/javascript">
    $(function(){
        $('<p>test2</p>').insertBefore('.a');
    });
    </script>
    
  • 相关阅读:
    python爬虫 --- 简书评论
    python 爬虫 伪装
    pygal的简单使用
    anaconda安装不存在的包
    python爬虫 赶集网
    my.conf 修改编码
    python3.6 使用 pymysql 连接 Mysql 数据库及 简单的增删改查操作
    基于visual Studio2013解决C语言竞赛题之1021九九乘法表
    基于visual Studio2013解决C语言竞赛题之1020订票
    基于visual Studio2013解决C语言竞赛题之1019填数
  • 原文地址:https://www.cnblogs.com/hustshu/p/15071731.html
Copyright © 2011-2022 走看看