一.移动元素

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. Mac超好用的软件合集和系统设置

    软件篇 这些软件好像只有动态壁纸是收费的. 推荐的都是特别小巧,更加专注特定功能,没那么多花里胡哨.当然你们有什么更好用的也可以推荐. 简单,好用才是我最喜欢的. Bob Github开源,Bob 是 ...

  2. 并发编程之:JUC并发控制工具

    大家好,我是小黑,一个在互联网苟且偷生的农民工. 在上一期我们讲了Thread.join()方法和CountDownLatch,这两者都可以做到等待一个线程执行完毕之后当前线程继续执行,并且Count ...

  3. .Net性能调优-MemoryPool

    简单用法 //获取MemoryPool实例,实际返回了一个ArrayMemoryPool<T> MemoryPool<char> Pool = MemoryPool<ch ...

  4. Spring Boot 2.x 之构建Fat Jar和可执行Jar

    Spring Boot提供的Maven插件spring-boot-maven-plugin可以用来构建Fat Jar和可执行Jar. 1.Fat Jar Fat Jar需要使用 java -jar x ...

  5. 机器学习——逻辑回归(Logistic Regression)

    1 前言 虽然该机器学习算法名字里面有"回归",但是它其实是个分类算法.取名逻辑回归主要是因为是从线性回归转变而来的. logistic回归,又叫对数几率回归. 2 回归模型 2. ...

  6. DP之背包经典三例

    0/1背包 HDU2602 01背包(ZeroOnePack): 有N件物品和一个容量为V的背包,每种物品均只有一件.第i件物品的费用是c[i],价值是w[i].求解将哪些物品装入背包可使价值总和最大 ...

  7. 垃圾分类app--NABCD--团队项目需求与分析

    我们的产品是--智能垃圾分类APP,它的设计灵感的来自于"可持续化发展战略,走绿色发展道路",众所周知,垃圾是放错了地方的资源,因此我们团队为了响应国家"垃圾分类&quo ...

  8. 手机端wap站网页播放腾讯视频代码

    <div class="detail-con clear"> <div id="mod_player_wrap" class="mo ...

  9. Kotlin协程基础

    开发环境 IntelliJ IDEA 2021.2.2 (Community Edition) Kotlin: 212-1.5.10-release-IJ5284.40 我们已经通过第一个例子学会了启 ...

  10. php nginx 路径批量配置

    * 假设 E:\upload 作为图片上传的位置 nginx 做web服务 * 创建文件conf.php 放到这个目录下 <?php function handleDir($it, &$ ...