使用jQuery操作DOM的方法小结


Posted in Javascript onFebruary 27, 2017

一.DOM操作分为3类

1.DOM Core

DOM Core不是Javascript的专属品,任何一种支持DOM的编程语言都可以使用它.它的用途不仅限于处理一种使用标记语言编写出来的文档

2.HTML-DOM

比DOM Core出现的更早,它提供了一些更加简明的标记来描述各种HTML-DOM的元素属性

3.CSS-DOM

CSS-DOM 失针对CSS的操作,在JavaScript中,只要作用是获取和设置style对象各种属性

二.样式操作

1.直接设置样式值

css(name,value)  //设置单个属性
css({name:value,name:value,name:value....})  //同事设置多个属性

2.追加样式和移除样式

addClass(class) //追加样式
removeClass(class)  //移除样式

3.切换样式

taggleClass()    //可以切换不同元素的类样式

三.类容操作

1.html代码操作

html([content])  //可选,规定备选元素的新类容,该参数可以包含HTML标签,无参数时,表示被选元素的文本类容

2.标签类容操作

text([content])  //可选,规定被选元素的新文本类容.  注释,特殊字符会被编码.无参数时,表示获取元素的被选类容

3.属性值操作

val([value])   

四.节点属性操作

1.查找节点

$("xxx")

2.创建节点

$(selector) //选择器
$(element) //Dom元素
$(html)    //html代码

3.插入节点

内部插入:append(content)  appendTo(content)   prepend(content)   prependTo(content)

外部插入:after(content)   insertAfter(content)   before(content)   insertBefore(content)

4.删除节点

$(selector).remove([expr])

5.替换节点

$("ul li:eq(1)").replaceWith($xxx)

6.复制节点

$(selector).clone([includeEvents])

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
可输入的下拉框
Jun 19 Javascript
JavaScript 继承详解 第一篇
Aug 30 Javascript
JAVASCRIPT style 中visibility和display之间的区别
Jan 22 Javascript
js 编写规范
Mar 03 Javascript
为radio类型的INPUT添加客户端脚本(附加实现JS来禁用onClick事件思路代码)
Nov 11 Javascript
javascript中String类的subString()方法和slice()方法
May 24 Javascript
web的各种前端打印方法之jquery打印插件PrintArea实现网页打印
Jan 09 Javascript
得到jQuery detach()后节点中的某个值实现代码
Feb 05 Javascript
jQuery学习笔记之 Ajax操作篇(三) - 过程处理
Jun 23 Javascript
基于javascript实现浏览器滚动条快到底部时自动加载数据
Nov 30 Javascript
JavaScript 用fetch 实现异步下载文件功能
Jul 21 Javascript
Vue实现剪切板图片压缩功能
Feb 04 Javascript
jQuery模拟淘宝购物车功能
Feb 27 #Javascript
原生js实现轮播图
Feb 27 #Javascript
PHP实现本地图片上传和验证功能
Feb 27 #Javascript
Bootstrap modal 多弹窗之叠加关闭阴影遮罩问题的解决方法
Feb 27 #Javascript
提高Web性能的前端优化技巧总结
Feb 27 #Javascript
Bootstrap modal 多弹窗之叠加引起的滚动条遮罩阴影问题
Feb 27 #Javascript
node.js入门教程之querystring模块的使用方法
Feb 27 #Javascript
You might like
javascript 控制弹出窗口
2007/04/10 Javascript
一个JQuery写的点击上下滚动的小例子
2011/08/27 Javascript
基于jquery实现的可编辑下拉框实现代码
2014/08/02 Javascript
JS实现下拉菜单赋值到文本框的方法
2015/08/18 Javascript
javascript图片预加载完整实例
2015/12/10 Javascript
JS实现部分HTML固定页面顶部随屏滚动效果
2015/12/24 Javascript
window.onerror()的用法与实例分析
2016/01/27 Javascript
javascript深拷贝(deepClone)详解
2016/08/24 Javascript
移动适配的几种方案(三种方案)
2016/11/25 Javascript
vue实现登陆登出的实现示例
2017/09/15 Javascript
JavaScript实现正则去除a标签并保留内容的方法【测试可用】
2018/07/18 Javascript
Vue插件打包与发布的方法示例
2018/08/20 Javascript
基于elementUI使用v-model实现经纬度输入的vue组件
2019/05/12 Javascript
js实现九宫格布局效果
2020/05/28 Javascript
EXTJS7实现点击拖拉选择文本
2020/12/17 Javascript
[03:07]完美世界DOTA2联赛PWL DAY10 决赛集锦
2020/11/11 DOTA
python中常用的九种预处理方法分享
2016/09/11 Python
利用python的socket发送http(s)请求方法示例
2018/05/07 Python
在python中修改.properties文件的操作
2020/04/08 Python
python 实现朴素贝叶斯算法的示例
2020/09/30 Python
matplotlib更改窗口图标的方法示例
2021/02/03 Python
localStorage 设置过期时间的方法实现
2018/12/21 HTML / CSS
世界首屈一指的在线男士内衣权威:HisRoom
2017/08/05 全球购物
Giglio美国站:意大利奢侈品购物网
2018/02/10 全球购物
美国马匹用品和马钉购物网站:State Line Tack
2018/08/05 全球购物
LODI女鞋在线商店:阿利坎特的鞋类品牌
2019/02/15 全球购物
母亲七十大寿答谢词
2014/01/18 职场文书
全国优秀辅导员事迹材料
2014/05/14 职场文书
护理工作个人总结
2015/03/03 职场文书
门球健将观后感
2015/06/16 职场文书
运动会主持词大全
2015/07/02 职场文书
2015年学校少先队工作总结
2015/07/20 职场文书
原生JS封装vue Tab切换效果
2021/04/28 Vue.js
vue判断按钮是否可以点击
2022/04/09 Vue.js
Oracle 11g数据库使用expdp每周进行数据备份并上传到备份服务器
2022/06/28 Oracle
Nginx跨域问题解析与解决
2022/08/05 Servers