• 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>
    
  • 相关阅读:
    Windows快捷方式的形式关机方法
    [Andriod官方训练教程]创建你的第一个App之创建一个简单的用户界面
    使用GDAL对HDF数据进行geoloc校正
    破解sqlyog 30天试用限制
    [Andriod官方训练教程]创建你的第一个App之运行你的App
    [Andriod官方训练教程]创建你的第一个App之开始另一个Activity
    GDAL对空间数据的管理
    win linux 下 部署war包到Tomcat根目录
    Spring session
    使用GDAL对HDF数据进行校正
  • 原文地址:https://www.cnblogs.com/hustshu/p/15071731.html
Copyright © 2020-2023  润新知