javascript-jquery-文档处理
一.移动元素
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-文档处理的更多相关文章
- jQuery 核心 - noConflict() 方法,jQuery 文档操作 - detach() 方法
原文地址:http://www.w3school.com.cn/jquery/manipulation_detach.asp 实例 使用 noConflict() 方法为 jQuery 变量规定新 ...
- jQuery文档操作方法对比和src写法
jQuery文档操作方法对比 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...
- jQuery 文档操作 - prependTo() ,appendTo()方法
其他jquery文档操作方法:http://www.w3school.com.cn/jquery/jquery_ref_manipulation.asp jQuery 参考手册 - 文档操作 appe ...
- 转 创建 JavaScript XML 文档注释
http://www.cnblogs.com/chenxizhang/archive/2009/07/12/1522058.html 如何:创建 JavaScript XML 文档注释 Visual ...
- JavaScript : DOM文档解析详解
JavaScript DOM 文档解析 1.节点(node):来源于网络理论,代表网络中的一个连接点.网络是由节点构成的集合 <p title=“a gentle reminder”> ...
- jQuery文档加载完毕的几种写法
js中文档加载完毕.一般在body加一个onload事件或者window.onload = function () {} jQuery中有好多写法,平时也不注意,别人一问,还真觉得头大. 下面是我整理 ...
- Javascript自动化文档工具JSDuck在Windows下的使用心得
作者: zyl910 一.工具比较 为了让前端JavaScript程序更具可维护性,更利于团队开发,文档非常重要.此时便需要使用自动化文档工具了. 我对比了各种JavaScript自动化文档工具,发现 ...
- jQuery 文档操作方法
jQuery 文档操作方法 这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html(). 方法 描述 addClass() 向匹配的元素添加指定的类名. after() 在匹配的元素之 ...
- JavaScript的文档对象模型DOM
小伙伴们之前我们讲过很多JavaScript的很多知识点,可以点击回顾一下: <JavaScript大厦之JS运算符>: <JavaScript工作原理:内存管理 + 如何处理4个常 ...
- jQuery文档操作
jQuery文档操作 1.jq文档结构 var $sup = $('.sup'); $sup.children(); // sup所有的子级们 $sup.parent(); // sup的父级(一个, ...
随机推荐
- Junit5快速入门指南-4
Junit5套件测试 @RunWith(JUnitPlatform.class) 执行套件 @SelectPackages({"packageA","packageB&q ...
- 快速模式第二包: quick_inI1_ouR1()
文章目录 1. 序言 2. quick_inI1_outR1()流程图 3. 快速模式消息②数据包格式 4. 源码分析 4.1 quick_inI1_outR1() 4.2 quick_inI1_ou ...
- CSS001. 纯CSS实现瀑布流(纵向排序)
通过 Multi-columns 相关的属性 column-count.column-gap 配合 break-inside 来实现瀑布流布局. 首先对包裹图片的盒子增加样式,column-count ...
- Weblogic Coherence组件漏洞初探CVE-2020-2555
Weblogic Coherence组件漏洞初探CVE-2020-2555 2020年1月,互联网上爆出了weblogic反序列化远程命令执行漏洞(CVE-2020-2555),Oracle Fusi ...
- 常用CSS的布局问题;
一.溢出文案省略号显示: //当文字长度超过50px会已省略好的方式显示: width:50px; overflow: hidden; text-overflow: ellipsis; white-s ...
- io流-缓冲流
单独去数据时,数据按块读入缓冲区,其后的操作则直接访问缓冲区 但是用 BufferedInputStream读取字节文件时,
- cmd中输出换行和转义字符
cmd 中输出换行和转义字符 今天想写一个安装 Windows 任务的 bat 脚本,在命令行界面输出换行和转义一些字符,居然搜索了好久才搜到正确操作,因此记录一下. 在命令行界面输出换行 echo. ...
- 论文解读(BYOL)《Bootstrap Your Own Latent A New Approach to Self-Supervised Learning》
论文标题:Bootstrap Your Own Latent A New Approach to Self-Supervised Learning 论文方向:图像领域 论文来源:NIPS2020 论文 ...
- 学习PHP中的高精度计时器HRTime扩展
不知道大家还记得在学校的时候体育测试时老师带的秒表吗?当枪声想起时,我们开始跑步,这时秒表启动,当我们跑过终点后,老师会按下按扭记录我们的成绩,这就是一个典型的定时器的应用.今天我们要学习的内容其实就 ...
- Java基础系列(40)- Arrays类
Arrays类 数据的工具类java.util.Arrays 由于数组对象本身并没有什么方法可以供我们调用,但API中提供了一个工具类Arrays供我们使用,从而可以对数据对象进行一些基本的操作 查看 ...