使用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 相关文章推荐
新浪的图片新闻效果
Jan 13 Javascript
基于jquery的内容循环滚动小模块(仿新浪微博未登录首页滚动微博显示)
Mar 28 Javascript
自己做的模拟模态对话框实现代码
May 23 Javascript
sencha touch 模仿tabpanel导航栏TabBar的实例代码
Oct 24 Javascript
分享我的jquery实现下拉菜单心的
Nov 29 Javascript
ajax的分页查询示例(不刷新页面)
Jan 11 Javascript
详解Vue中使用v-for语句抛出错误的解决方案
May 04 Javascript
使用socket.io实现简单聊天室案例
Jan 02 Javascript
解决vue-cli项目webpack打包后iconfont文件路径的问题
Sep 01 Javascript
vue实现登录页面的验证码以及验证过程解析(面向新手)
Aug 02 Javascript
Vue 自定义标签的src属性不能使用相对路径的解决
Sep 17 Javascript
JS自定义右键菜单实现代码解析
Jul 16 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
PHP 字符串操作入门教程
2006/12/06 PHP
PHP操作Memcache实例介绍
2013/06/14 PHP
PHP设计模式之简单工厂和工厂模式实例分析
2019/03/25 PHP
在浏览器中获取当前执行的脚本文件名的代码
2011/07/19 Javascript
JS获取页面窗口大小的代码解读
2011/12/01 Javascript
jquery多行滚动/向左或向上滚动/响应鼠标实现思路及代码
2013/01/23 Javascript
JavaScript 七大技巧(一)
2015/12/13 Javascript
js基于setTimeout与setInterval实现多线程
2016/06/17 Javascript
JavaScript 冒泡排序和选择排序的实现代码
2016/09/03 Javascript
jQuery通过ajax快速批量提交表单数据
2016/10/25 Javascript
JavaScript Date 知识浅析
2017/01/29 Javascript
100行代码理解和分析vue2.0响应式架构
2017/03/09 Javascript
JQuery判断正整数整理小结
2017/08/21 jQuery
用npm安装vue和vue-cli,并使用webpack创建项目的方法
2018/09/28 Javascript
如何使用less实现随机下雪动画详解
2019/01/02 Javascript
TypeScript开发Node.js程序的方法
2019/04/30 Javascript
koa-router路由参数和前端路由的结合详解
2019/05/19 Javascript
微信小程序 获取手机号 JavaScript解密示例代码详解
2020/05/14 Javascript
python同时给两个收件人发送邮件的方法
2015/04/30 Python
Python中unittest模块做UT(单元测试)使用实例
2015/06/12 Python
一个基于flask的web应用诞生 bootstrap框架美化(3)
2017/04/11 Python
Python实现OpenCV的安装与使用示例
2018/03/30 Python
Python中对数组集进行按行打乱shuffle的方法
2018/11/08 Python
Python3实现腾讯云OCR识别
2018/11/27 Python
tesserocr与pytesseract模块的使用方法解析
2019/08/30 Python
python使用opencv实现马赛克效果示例
2019/09/28 Python
css3绘制天猫logo实现代码
2012/11/06 HTML / CSS
美国药妆网站:EDCskincare.com(防晒、痤疮、抗衰老等)
2017/04/28 全球购物
美国手机支架公司:PopSockets
2019/11/27 全球购物
俄罗斯皮肤健康中心:Pharmacosmetica.ru
2020/02/22 全球购物
逻辑链路控制协议
2016/10/01 面试题
市政管理求职信范文
2014/05/07 职场文书
人力资源管理专业求职信
2014/07/23 职场文书
国际贸易系求职信
2014/08/09 职场文书
学校远程教育工作总结
2015/08/11 职场文书
拒绝盗图!教你怎么用python给图片加水印
2021/06/04 Python