<!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. 20165234 2017-2018-2《Java程序设计》课程总结

    2017-2018-2<Java程序设计>课程总结 一.作业链接汇总 每周作业链接 预备作业一:我期望的师生关系 预备作业二:学习基础和C语言基础调查 预备作业三:Linux安装及学习 第 ...

  2. classpath和classpath*的区别

    classpath 指的是自己项目里的编译后的class路径 classpath* 包含jar包里面的class路径

  3. 【keepalived】CentOS7.0下安装教程

    安装前所需环境 keepalived安装之前,需要环境:wget.gcc.pcre.openssl.zlib.popt-devel 1,wget:用于从外网上下载插件 wget安装命令:yum -y ...

  4. mac技巧之常用的快键键

    1.修改文件名 选中文件按return键即可修改文件名. 2.文件预览 选中文件按照空格键即可实现文件的预览(并不是打开文件) 3.任务之间进行切换 command+tab 4.复制文件 推动文件按照 ...

  5. node promise库bluebird

    var fs = require('fs') var Promise = require("bluebird") function file1() { return new Pro ...

  6. ORACLE IMPDP导入报表数据已存在

    背景 搞了这么多年oracle,不论是开发和运维,自认为是都了解了,和dba差的只是熟练的问题,因为毕竟不是天天搞它.不过突然听说数据泵导入的功能,大吃一惊,好像有印象,以为是落后的,一查,竟然是先进 ...

  7. 判断鼠标进入容器的方向小Demo

    参考资料: 贤心博客:http://sentsin.com/web/112.html, Math.atan2(y,x) 解释 :http://www.w3school.com.cn/jsref/jsr ...

  8. daemon.debug hostapd: wlan0: WPA rekeying GTK

    现象描述:client连接上AP后,切换接口(譬如lan口的)模式,静态地址和dhcp模式切换后,一段时间后断开连接,再也连接不上,ap侧日志如下: Wed Nov  8 14:39:31 2017 ...

  9. 弹出框sweetalert插件的简单使用

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

  10. mariadb：SQL日常使用总结

    1.关联删除 DELETE T_Base_Resource_Action FROM T_Base_Resource_Action  INNER JOIN T_Base_Resource ON T_Ba ...