一.移动元素

1.append():向每个匹配元素的内部追加内容。例如:$("选择器1").qppend("选择器2");将会匹配选择器2的元素,移动到匹配选择器1的内部尾部。

例如:

$("div").append($("p")).addClass("highlight");//添加高亮。

appendTo():将所有匹配的元素追加到指定的元素中//jquery对象发生改变,更改为匹配$("p")元素

append()和appendTo()方法颠倒过来

例如:

$("p").appendTo($("div")).addClass("highlight");//功能与上面相同

2.prepend():向每个匹配的元素内部前置前置内容

prependTo():将所有的匹配元素前置到指定的元素中//内部与内部的前面

3.after():在每个匹配的元素之后插入内容

insertAfter():将所有匹配的元素插入到指定元素的后面

4.before():在每个匹配的元素之前插入内容

insertBefore():将所有匹配的元素插入到指定元素的前面

二、替换元素

replaceWith()方法,可以移动页面上的所有元素来替换当前选定的替换页面的所有元素匹配。

例如:

$(function(){
  $("p").replaceWith("<strong>你好123</strong>");//等同于
  $("<strong>你好123</strong>").replaceAll("p");
})

replaceAll和replaceWith()颠倒过来。

三、包裹节点

1.wrapall()

该方法将所有匹配的元素用一个元素包裹起来

例如:

$("strong").wrapall("<b></b>");是将所有的strong标记外
加上了b标记<p></p>外包裹<b>即是<b><p></p></b>内包裹即是放到里面。

2.wraplnner()

-该方法是将每个匹配元素的子内容(包括文本节点)用其他结构化得标记包裹起来。和上边一样。

例如:

$("strong").wraplnner("<b></b>")可以替换成代码:
<strong><b>你好</b></strong>,b加到strong里面。

四、删除或清空节点

1.remove方法删除。

--将所有匹配的元素删除,例如

$("ul li:eq(1)").remove();

--根据属性删除:

$("ul li").remove("li[title!='ab']");

2.empty清空

--清除节点,它能清除元素中的所有后代节点

$("ul li:eq(1)").empty();回去第二个li元素节点后,清空元素里的内容。

  

javascript-jquery-文档处理的更多相关文章

  1. jQuery 核心 - noConflict() 方法,jQuery 文档操作 - detach() 方法

    原文地址:http://www.w3school.com.cn/jquery/manipulation_detach.asp   实例 使用 noConflict() 方法为 jQuery 变量规定新 ...

  2. jQuery文档操作方法对比和src写法

    jQuery文档操作方法对比 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

  3. jQuery 文档操作 - prependTo() ,appendTo()方法

    其他jquery文档操作方法:http://www.w3school.com.cn/jquery/jquery_ref_manipulation.asp jQuery 参考手册 - 文档操作 appe ...

  4. 转 创建 JavaScript XML 文档注释

    http://www.cnblogs.com/chenxizhang/archive/2009/07/12/1522058.html 如何:创建 JavaScript XML 文档注释 Visual ...

  5. JavaScript : DOM文档解析详解

    JavaScript DOM  文档解析 1.节点(node):来源于网络理论,代表网络中的一个连接点.网络是由节点构成的集合 <p title=“a gentle reminder”> ...

  6. jQuery文档加载完毕的几种写法

    js中文档加载完毕.一般在body加一个onload事件或者window.onload = function () {} jQuery中有好多写法,平时也不注意,别人一问,还真觉得头大. 下面是我整理 ...

  7. Javascript自动化文档工具JSDuck在Windows下的使用心得

    作者: zyl910 一.工具比较 为了让前端JavaScript程序更具可维护性,更利于团队开发,文档非常重要.此时便需要使用自动化文档工具了. 我对比了各种JavaScript自动化文档工具,发现 ...

  8. jQuery 文档操作方法

    jQuery 文档操作方法 这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html(). 方法 描述 addClass() 向匹配的元素添加指定的类名. after() 在匹配的元素之 ...

  9. JavaScript的文档对象模型DOM

    小伙伴们之前我们讲过很多JavaScript的很多知识点,可以点击回顾一下: <JavaScript大厦之JS运算符>: <JavaScript工作原理:内存管理 + 如何处理4个常 ...

  10. jQuery文档操作

    jQuery文档操作 1.jq文档结构 var $sup = $('.sup'); $sup.children(); // sup所有的子级们 $sup.parent(); // sup的父级(一个, ...

随机推荐

  1. golang map实现原理

    这篇文章主要讲 map 的赋值.删除.查询.扩容的具体执行过程,仍然是从底层的角度展开.结合源码,看完本文一定会彻底明白 map 底层原理. 我要说明的是,这里对 map 的基本用法涉及比较少,我相信 ...

  2. PyQT5:信号和槽

    PyQT5:信号和槽 信号和槽 Qt的主要特征之一是它使用信号和插槽在对象之间进行通信. 当潜在的事件发生时,会发出一个信号.插槽是可调用的Python,如果将信号连接到插槽,则在发出信号时将调用该插 ...

  3. 为什么Class实例可以不是全局唯一的——自定义类加载器

    为什么Class实例可以不是全局唯一的 通过定义两个类加载器加载同一字节码文件来证明Class实例为什么不是全局唯一的 1.将一个名为Demo(没有后缀)的字节码文件放在D盘根目录 2.定义两个类加载 ...

  4. mybatis动态sql以及分页

    1.mybatis动态sql 2.模糊查询 3.查询返回结果集的处理 4.分页查询 5.特殊字符处理 1.mybatis动态sql If.trim.foreach If 标签判断某一字段是否为空 &l ...

  5. noip模拟41

    A. 你相信引力吗 很明显的单调栈的题,考场上没有想到平移最大值,而是想着复制一倍序列破环成链,然后发现最大值的部分特别难维护,而且耗费时间过长,只好牺牲时间复杂度加了个 \(map\) 去重. 首先 ...

  6. error : Hooks can only be called inside of the body of a function component. 依赖包和主包加载多个react 引发冲突问题

    1. 结论: 在依赖包和主包的node-modules中,同时install包含react , react-dom 或者react-redux时,跑测试或者启动的时候,显示如下error.当然出现这个 ...

  7. 358 day09字节流、字符流

    day09[字节流.字符流] 主要内容 IO流 字节流 字符流 异常处理 Properties 教学目标 [ ] 能够说出IO流的分类和功能 [ ] 能够使用字节输出流写出数据到文件 [ ] 能够使用 ...

  8. 3.15学习总结(Python爬取网站数据并存入数据库)

    在官网上下载了Python和PyCharm,并在网上简单的学习了爬虫的相关知识. 结对开发的第一阶段要求: 网上爬取最新疫情数据,并存入到MySql数据库中 在可视化显示数据详细信息 项目代码: im ...

  9. Django学习day02随堂笔记

    每日测验 """ 今日考题 1.谈谈你对web框架的认识,简述web框架请求流程 2.python三大主流web框架的区别 3.安装django需要注意的事项有哪些(最少 ...

  10. mysql5.7当两个字段名类似,查询时会出错

    excepInfo: select id,describe from iwebshop_student_problem where id=256 order by id desc -- You hav ...