<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>列表</title>
    <script rel="script" src="js/jquery.min.js"></script>
    <script rel="script" src="js/vue.min.js"></script>
    <style>
    </style>
</head>

<body>
<b>hello world</b><i>I would like to say：</i>
<div>
    <p>Ben</p>
    <p>Jack</p>
    <p>Linda</p>
    <p>Bob</p>
</div>

<em>Anna</em>
<em>Anne</em>
<em>Lucy</em>
<br><br><br><br>

<strong class="first">查理</strong>
<strong class="second">威廉</strong>
<strong class="third">大卫</strong>

<a href="#">首页</a>
<a href="#">产品</a>
<a href="#">技术</a>
<a href="#">关于</a>

<p>Hello, <span>Person</span> <a href="#">and person</a></p>
<script>
    $(document).ready(function () {
        $("p").unwrap();//将外层包裹着的父级div层去掉
        $("i").after($("b"));//将b标签元素放在i标签元素后面，而不是将i标签元素放在b标签元素后面
        $("em").wrapAll("<div></div>");//将所有的em标签元素都用父级div包裹起来
        $("em").wrapInner("<b></b>");//把所有的em标签元素都加粗
        $('.third').replaceWith($('.first'));//将第一个strong标签包含文本替换成第一个strong标签的文本内容。
        // 且是将原来的第三个strong标签及其文本删除了之后替换成第一个strong标签元素及其文本来显示，而不是说复制一份来替换。

        $("<em>斜体字</em>").replaceAll($("a"));//将a标签以及文本内容全部替换为em标签及其文本

       //$("p").empty();//将p元素的所有子元素删除。只剩下p空标签
    })
</script>

</body>
</html>

jQuery常见的几个文档处理方式的更多相关文章

  1. jQuery弹出层---artDialog 文档

    artDialog是一个基于javascript编写的对话框组件,它拥有精致的界面与友好的接口 自适应内容 artDialog的特殊UI框架能够适应内容变化,甚至连外部程序动态插入的内容它仍然能自适应 ...

  2. js和jQuery获取各种屏幕或文档的高度和宽度

    1.jQuery获取文档或屏幕的高度 console.log($(window).height());//浏览器页面当前屏幕可见区域的高度 console.log($(document).height ...

  3. jQuery二——属性操作、文档操作、位置属性

    一.jquery的属性操作 jquery对象有它自己的属性和方法. 其中jquery的属性操作模块分为四个部分:html属性操作,dom属性操作,类样式操作和值操作. 1.html属性操作 是对htm ...

  4. jQuery插件之ajaxFileUpload API文档

    ajaxFileUpload是一个异步上传文件的jQuery插件. 语法:$.ajaxFileUpload([options]) options参数说明: 1.url  上传处理程序地址. 2,fil ...

  5. JAVADOC 常见使用方法 帮助文档

    我们知道Java中有三种注释语句: 1.//用于单行注释. 2./*...*/用于多行注释,从/*开始,到*/结束,不能嵌套. 3./**...*/则是为支持jdk工具javadoc.exe而特有的注 ...

  6. ApiDoc 文档使用方式

    1.安装node.js 2.打开node.js 命令窗(shell)键入npm install apidoc -g 自动安装(几分钟) 3. C:\Users\user\AppData\Roaming ...

  7. jQuery Colorpicker Spectrum api 中文 文档 属性 事件 方法

    jQuery Colorpicker Spectrum 所需的CSS和JavaScript文件: <script src='spectrum.js'></script> < ...

  8. jquery+easyui开发、培训文档

    目  录 1.... Accordion(可折叠标签)......................................................................... ...

  9. word&excel&ppt文档加密方式

    ppt excel word

随机推荐

  1. tarjan算法（求强连通子块，缩点）

    tarjan算法求图中的强连通子图的个数. #include<iostream> #include<stack> #include<queue> #include& ...

  2. keepalived高可用系列~keepalived+mysql

    一 简介:建立读写分离模式 二 keepalived相关配置 vrrp_instance VI_1 {  state MASTER  // 可修改  interface eth0  virtual_r ...

  3. 《2013传智播客视频》-wmv,avi,mp4.目录

    \!--14俄罗斯方块\视频\.复习.avi; \!--14俄罗斯方块\视频\ 复习.avi; \!--14俄罗斯方块\视频\ 形状旋转.avi; \!--14俄罗斯方块\视频\ 判断形状能否变形.a ...

  4. 一张图片资源要占用多大内存xhdpi xxhdpi

    一张图片资源要占用多大内存,可以用下面的计算公式计算 4 * withPixel*(targetDensity /sourcedensity) * heightPixel*(targetDensity ...

  5. Zookeeper学习笔记2

    环境搭建 JDK(>1.6)安装 略 Zookeeper安装 1.下载 http://mirror.bit.edu.cn/apache/zookeeper/stable/zookeeper-3. ...

  6. 【CentOS7.0】虚拟机如何实现扩展存储空间

    写在前面的一些小废话 有时候,虚拟机随着使用,会导致存储不够,这时就需要给虚拟机扩容. 扩容的前提是,此虚拟机没有快照. 扩容时,需要编辑虚拟机设置.为了形成对比,第一张图片是扩容前,第二张图片是扩容 ...

  7. Linux网络 - 数据包的接收过程【转】

    转自:https://segmentfault.com/a/1190000008836467 本文将介绍在Linux系统中,数据包是如何一步一步从网卡传到进程手中的. 如果英文没有问题,强烈建议阅读后 ...

  8. 无法修改linux/ubuntu密码(Authentication token manipulation error )问题解决过程【转】

    转自:https://blog.csdn.net/caizi001/article/details/38659189 Vmware虚拟机里的ubunut系统长期不用,密码忘记了,无奈只能通过slax ...

  9. 题解-USACO18DEC Sort It Out

    Problem 洛谷5156 题意概要:给定一个长为\(n\)的排列,可以选择一个集合\(S\)使这个集合内部元素排到自己在整个序列中应该在的位置(即对于集合\(S\)内的每一个元素\(i\),使其排 ...

  10. 迁移学习（Transfer Learning）

    原文地址:http://blog.csdn.net/miscclp/article/details/6339456 在传统的机器学习的框架下,学习的任务就是在给定充分训练数据的基础上来学习一个分类模型 ...