前端jQuery之文档操作
1.文档操作
内部插入
A.append(B) 吧B添加到A的后面
A.appendTo(B) 吧A添加到B的后面
A.prepend(B) 吧B添加到A的前面
A.prependTo(B) 吧A添加到B的前面
外部插入
A.after(B) 吧B添加到A的后面
A.insertAfter(B) 吧A添加到B的后面
A.before(B) 吧B添加到A的前面
A.insertBefore(B) 吧A添加到B的前面
2.克隆操作
$(选择器).clone();
例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>克隆</title>
</head>
<body>
<button class="c1">点我</button>
<script src="jquery-3.2.1.min.js"></script>
<script>
$(".c1").on("click",function () {
$(this).clone(true).insertAfter($(this))
})
</script>
</body>
</html>
3.替换操作
replaceWith(content|fn)
A.replaceWith(B) --> B替换A replaceAll(selector)
A.replaceAll(B) --> A替换B
//将所有的h5标题替换为a标签
$('h5').replaceWith('<a href="#">hello world</a>')
//将所有h5标题标签替换成id为app的dom元素
$('h5').replaceWith($('#app'));
4.删除操作
删除节点后,整个标签都会被删除
$('ul').remove();
删除节点后,事件保留
$(selector).detach();
清空选中元素中的所有后代子节点
//清空掉ul中的子元素,保留ul
$('ul').empty()
前端jQuery之文档操作的更多相关文章
- python 全栈开发,Day54(jQuery的属性操作,使用jQuery操作input的value值,jQuery的文档操作)
昨日内容回顾 jQuery 宗旨:write less do more 就是js的库,它是javascript的基础上封装的一个框架 在前端中,一个js文件就是一个模块 一.用法: 1.引入包 2.入 ...
- python全栈开发day48-jqurey自定义动画,jQuery属性操作,jQuery的文档操作,jQuery中的ajax
一.昨日内容回顾 1.jQuery初识 1).使用jQuery而非JS的六大理由 2).jQuery对象和js对象转换 3).jQuery的两大特点 4).jQuery的入口函数三大写法 5).jQu ...
- jQuery 的文档操作
在 js 中也有DOM操作,也可以进行 增删改查 ,但是通过 js 的DOM操作会发现,我的天哪,代码好多.但是 jQuery的文档操作就少了很多. js 中 DOM 的示例 : var box = ...
- (20)jQuery的文档操作(创建,添加、设置样式和删除等)
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>jq ...
- jQuery的文档操作
1.插入操作 一.父元素.append(子元素) 追加某元素 父元素中添加新的元素 var oli = document.createElement('li'); oli.innerHTML = '哈 ...
- jquery之文档操作
append(content|fn) 向每个匹配的元素内部添加内容(元素内部) appendTo(content) 把所有匹配的元素追加到另一个指定的元素中(元素内部) prepend(content ...
- jQuery系列(六):jQuery的文档操作
1.插入操作 (1) 语法: 父元素.append(子元素) 解释:追加某元素,在父元素中添加新的子元素.子元素可以为:stirng | element(js对象) | jquery元素 let ol ...
- 【JQuery】文档操作
一.前言 接着上一章的内容,接着JQuery的学习 二.内容 addClass 向被选元素添加一个或多个类 $(selector).addClass(class) $(selector).addCla ...
- 前端之JQuery:JQuery文档操作
jquery之文档操作 一.相关知识点总结1.CSS .css() - .css("color") -> 获取color css值 - .css("color&qu ...
随机推荐
- 彻底理解和解决移动WEB开发中CLICK点透问题
在移动WEB开发中,有时候可能会出现点透问题,本文将围绕这个TAP点透问题,详细的讲述到底什么是点透,为什么会出现点透,如何避免出现点透,如果不可避免的出现了,如何解决解决移动WEB开发中CLICK点 ...
- my___sublime Text配置
sublime text 备份 插件下载 http://www.cnblogs.com/457220157-FTD/p/5546545.html https://www.jianshu.com/p/3 ...
- maya2016无法安装卸载激活失败
AUTODESK系列软件着实令人头疼,安装失败之后不能完全卸载!!!(比如maya,cad,3dsmax等).有时手动删除注册表重装之后还是会出现各种问题,每个版本的C++Runtime和.NET f ...
- jQuery学习心得
表示在document.ready时执行代码 $(function(){ //1.取得要操作的对象(尽量只限制范围),如果对象多次使用要记得缓存 var $selector = $('selector ...
- 关于get_magic_quotes_gpc()函数(交互数据转义的判断)
在PHP中get_magic_quotes_gpc()函数是内置的函数,这个函数的作用就是得到php.ini设置中magic_quotes_gpc选项的值. 那么就先说一下magic_quotes_g ...
- ssh设置别名
通常我们在 Termianl 下用 ssh 链接远程主机的时候,每次都需要输入一长串的用户名加主机地址,是不是觉得很麻烦? 我们知道在 /etc/ssh/ 目录下通常都会有 ssh_config 和 ...
- Python实现抓取CSDN热门文章列表
1.使用工具: Python3.5 BeautifulSoup 2.抓取网站: csdn热门文章列表 http://blog.csdn.net/hot.html 3.分析网站代码: 4.实现代码: _ ...
- VS2013 自定义项目模板以及制作.vsix文件
一.环境检查 打开VS2013新建项目.如果在"其他项目类型"中不包含扩展性节点,则需要下载并安装vs2013 SDK. 二.创建项目模板 1,在VS中新建一个类库项目(此处仅以类 ...
- intellijidea课程 intellijidea神器使用技巧1-3 idea下载
下载: 下载地址:https://www.jetbrains.com/idea/download/ download==>windows==>ultimate版本(付费版本免费试用30天) ...
- apache安装 windows
进入cmd cd apache目录 httppd.exe ?显示全部命令 httppd.exe -k install 安装apache httppd.exe -k start 启动 检测是否运行 浏览 ...