使用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 相关文章推荐
获取页面高度,窗口高度,滚动条高度等参数值getPageSize,getPageScroll
Sep 22 Javascript
js 判断checkbox是否选中的实现代码
Nov 23 Javascript
30个最好的jQuery 灯箱插件分享
Apr 25 Javascript
jQuery不间断滚动效果(模拟百度新闻支持文字/图片/垂直滚动)
Feb 05 Javascript
easyui datagrid 键盘上下控制选中行示例
Mar 31 Javascript
TinyMCE提交AjaxForm获取不到数据的解决方法
Mar 05 Javascript
jQuery中 attr() 方法使用小结
May 03 Javascript
Bootstrap表单布局样式代码
May 31 Javascript
关于数据与后端进行交流匹配(点亮星星)
Aug 03 Javascript
利用js-cookie实现前端设置缓存数据定时失效
Jun 18 Javascript
js数据类型转换与流程控制操作实例分析
Dec 18 Javascript
js实现日历
Nov 07 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中模拟POST传递数据的两种方法分享
2011/09/16 PHP
php 利用socket发送GET,POST请求的实例代码
2020/07/04 PHP
jQuery 表单验证插件formValidation实现个性化错误提示
2009/06/23 Javascript
JavaScript开发规范要求(规范化代码)
2010/08/16 Javascript
Js注册协议倒计时的小例子
2013/06/24 Javascript
实现只能输入数字的input不用replace方法
2013/09/12 Javascript
javascript读取xml实现javascript分页
2013/12/13 Javascript
JavaScript字符串对象toLowerCase方法入门实例(用于把字母转换为小写)
2014/10/17 Javascript
以Python代码实例展示kNN算法的实际运用
2015/10/26 Javascript
BootStrap树状图显示功能
2016/11/24 Javascript
JS实现页面进入和返回定位到具体位置
2016/12/08 Javascript
详解Vue中添加过渡效果
2017/03/20 Javascript
JavaScript生成图形验证码
2020/08/24 Javascript
js中变量的连续赋值(实例讲解)
2017/07/08 Javascript
webpack构建换肤功能的思路详解
2017/11/27 Javascript
Vue-Access-Control 前端用户权限控制解决方案
2017/12/01 Javascript
微信小程序实现上传图片功能
2018/05/28 Javascript
微信小程序有旋转动画效果的音乐组件实例代码
2018/08/22 Javascript
一个简单的python程序实例(通讯录)
2013/11/29 Python
低版本中Python除法运算小技巧
2015/04/05 Python
Python的ORM框架中SQLAlchemy库的查询操作的教程
2015/04/25 Python
python实现12306火车票查询器
2017/04/20 Python
基于python时间处理方法(详解)
2017/08/14 Python
python学习必备知识汇总
2017/09/08 Python
Python实现通过继承覆盖方法示例
2018/07/02 Python
对python中的装包与解包实例详解
2019/08/24 Python
PyCharm 2020.2下配置Anaconda环境的方法步骤
2020/09/23 Python
英国皇家造币厂:The Royal Mint
2018/10/05 全球购物
数据员岗位职责
2013/11/19 职场文书
经济管理专业毕业生自荐信范文
2014/01/02 职场文书
殡葬服务心得体会
2014/09/11 职场文书
房屋买卖协议书范本
2014/09/27 职场文书
2015年幼儿园班主任工作总结
2015/05/12 职场文书
干货干货!2019最新优秀创业计划书
2019/03/21 职场文书
React中的Context应用场景分析
2021/06/11 Javascript
mysql拆分字符串作为查询条件的示例代码
2022/07/07 MySQL