<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>包裹 替换 删除 复制</title>
<script type="text/javascript" src="../js/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
$(function(){
    $('#box').wrap('<div></div>');//用div把匹配元素包起来
    $('#box').unwrap();//这个方法将快速取消.wrap方法的效果
    $('#box p').wrapAll('<div></div>')//将所有匹配的元素用指定元素包起来
    $('#box h1').wrapInner('<b></b>')//将匹配元素的内部元素用b标签包起来
    $('#box h1').replaceWith('<h2>这是h2标签</h2>')//将匹配元素及其内容用指定标签和内容替换
    $('<h1>haha</h1>').replaceAll('#box h2');//用指定元素替换所有指定元素
    $('ul').empty();//删除匹配的元素集合中的所有子节点
    $('ul').remove();//删除指定元素及内容
    //detach()与remove()有区别......
    $('#box p').clone().prependTo('#box');//复制指定元素一份
})
</script>
</head>
<body>
    <div id="box">
        <p>p标签</p>
        <h1>h1标签</h1>
        <h2>h2标签</h2>
    </div>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>
</body>
</html>

jquery基础-包裹 替换 删除 复制的更多相关文章

  1. 文档处理jQuery,实现添加删除复制

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. jQuery基础课程

    环境搭建 搭建一个jQuery的开发环境非常方便,可以通过下列几个步骤进行. 下载jQuery文件库 在jQuery的官方网站(http://jquery.com)中,下载最新版本的jQuery文件库 ...

  3. JQuery基础总结上

    最近在慕课网学习JQuery基础课程,发现只是跟随网站的课程学习而不去自己总结扩展的话,很难达到真正学会理解的地步. 于是先在网站上草草过了一遍课程,然后借着今天的这个时间边记录边重新整理学习一下. ...

  4. Jquery基础教程第二版学习记录

    本文仅为个人jquery基础的学习,简单的记录以备忘. 在线手册:http://www.php100.com/manual/jquery/第一章:jquery入门基础jquery知识:jquery能做 ...

  5. jQuery基础之二

    jQuery基础之二   jQuery的中文文档十分详细,并且权威.W3C的jQuery文档更加简单实用. jQuery 1.9.0 jQuery中文文档W3C的jQuery文档 jQuery操作DO ...

  6. jquery基础知识汇总

    jquery基础知识汇总 一.简介 定义 jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库.源码戳这 jQu ...

  7. JQuery基础学习总结

    JQuery基础学习总结 简单总结下JQuery: 一:事件 1.change事件 <!DOCTYPE html> <html lang="en"> < ...

  8. 《jQuery基础教程(第四版)》学习笔记

    本书代码参考:Learning jQuery Code Listing Browser 原书: jQuery基础教程 目录: 第2章 选择元素 1. 使用$()函数 2. 选择符 3. DOM遍历方法 ...

  9. 《jQuery基础教程》读书笔记

    最近在看<jQuery基础教程>这本书,做了点读书笔记以备回顾,不定期更新. 第一章第二章比较基础,就此略过了... 第三章 事件 jQuery中$(document).ready()与j ...

随机推荐

  1. 从零开始学习jQuery (八) 插播:jQuery实施方案

    一.摘要 本系列文章将带您进入jQuery的精彩世界, 其中有很多作者具体的使用经验和解决方案,  即使你会使用jQuery也能在阅读中发现些许秘籍. 本篇文章属于临时插播,  用于介绍我在本公司的j ...

  2. CentOS+Nginx一步一步开始配置负载均衡

    Nginx负载均衡的理解 http://www.linuxdiyf.com/linux/10205.html Nginx是一个轻量级的.高性能的WebServer,他主要可以干下面两件事: 作为htt ...

  3. HW3.23

    import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...

  4. HW1.7

    public class Solution { public static void main(String[] args) { System.out.println("π = " ...

  5. c c++ 函数入口和出口的hook(gcc 编译选项),然后打印出函数调用关系的方法

    GCC Function instrumentation机制可以用来跟踪函数的调用关系,在gcc中对应的选项为“-finstrument-functions”.可查看gcc的man page来获取更详 ...

  6. glance image cache

    The Glance Image Cache The Glance API server may be configured to have an optional local image cache ...

  7. Linux下OpenSSL 安装

    安装环境:  操作系统:CentOs6.3 OpenSSL Version:openssl-1.0.0e.tar.gz 目前版本最新的SSL地址为http://www.openssl.org/sour ...

  8. linux安装svn服务器(yum方式)

    1.查看yum是否安装         在终端中输入yum即可如果已经安装,会显示yum的参数         如果没有安装,会提示yum未安装或无效命令…… 2.安装svnyum -y instal ...

  9. Oracle学习过程(随时更新)

    1.入门 实用的一些查询语句: 查询用户所有表注释 select * from user_tab_comments 条件查询 根据两个值查询 select*from table where 字段 in ...

  10. [caffe]深度学习之图像分类模型VGG解读

    一.简单介绍 vgg和googlenet是2014年imagenet竞赛的双雄,这两类模型结构有一个共同特点是go deeper.跟googlenet不同的是.vgg继承了lenet以及alexnet ...