jQuery学习笔记[1] jQuery中的DOM操作


Posted in Javascript onDecember 03, 2010

DOM分为3个方面,即DOM Core,HTML-DOM,CSS-DOM.
1,DOM Core并不专属于JavaScript,任何一种支持DOM的程序设计语言都可以使用它.
JavaScript中的getElementById(),getElementsByTagName()...等方法.
例如:使用DOM Core来获取表单对象的方法:
document.getElementsByTagName("form");
2,HTML-DOM.
在使用JavaScript和DOM为HTML文件编写脚本的时候.有许多专属于HTML-DOM的属性.HTML-DOM的出现甚至比DOM Core还要早,它提供了一些更简明的记号来描述各种HTML元素的属性.
例如:使用HTML-DOM来获取表单对象的方法:
document.forms //HTML-DOM提供了一个forms对象.
3,CSS-DOM
CSS-DOM是针对CSS的操作.在JavaScript中CSS-DOM技术的主要作用是获取和设置style对象的各种属性.
例如:设置某元素style对象字体颜色的方法:element.style.color="red";
下面学习的是:jQuery中的DOM操作:
先构建出一棵DOM树:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>jQuery中的DOM操作</title> 
</head> 
<body> 
<p title="选择你最喜欢的水果">你最喜欢的水果是?</p> 
<ul> 
<li title="苹果">苹果</li> 
<li title="橘子">橘子</li> 
<li title="菠萝">菠萝</li> 
</ul> 
</body> 
</html>

接下来的操作都是围绕这个DOM树而展开的.
Javascript 相关文章推荐
脚本收藏iframe
Jul 21 Javascript
Jquery实现带动画效果的经典二级导航菜单
Mar 22 Javascript
导航跟随滚动条置顶移动示例代码
Sep 11 Javascript
javascript间隔定时器(延时定时器)学习 间隔调用和延时调用
Jan 13 Javascript
jQuery简单实现网页选项卡特效
Nov 24 Javascript
JS实现文字掉落效果的方法
May 06 Javascript
JavaScript使用DeviceOne开发实战(三)仿微信应用
Dec 02 Javascript
bootstrap多种样式进度条展示
Dec 20 Javascript
微信小程序中顶部导航栏的实现代码
Mar 30 Javascript
jQuery实现选中行变色效果(实例讲解)
Jul 06 jQuery
详解webpack自定义loader初探
Aug 29 Javascript
GOJS+VUE实现流程图效果
Dec 01 Javascript
浅析jQuery的链式调用之each函数
Dec 03 #Javascript
jQuery的链式调用浅析
Dec 03 #Javascript
加速IE的Javascript document输出的方法
Dec 02 #Javascript
关于Ext中form移除textfield方法:hide(),setVisible(false),remove()
Dec 02 #Javascript
javascript学习之闭包分析
Dec 02 #Javascript
JavaScript OOP面向对象介绍
Dec 02 #Javascript
JavaScript 字符串处理函数使用小结
Dec 02 #Javascript
You might like
php str_pad 函数使用详解
2009/01/13 PHP
PHP远程采集图片详细教程
2014/07/01 PHP
封装ThinkPHP的一个文件上传方法实例
2014/10/31 PHP
浅谈PHP中关于foreach使用引用变量的坑
2016/11/14 PHP
PHP命名空间namespace的定义方法详解
2017/03/29 PHP
Laravel关联模型中过滤结果为空的结果集(has和with区别)
2018/10/18 PHP
PHP模版引擎原理、定义与用法实例
2019/03/29 PHP
Laravel+Intervention实现上传图片功能示例
2019/07/09 PHP
php+ajax实现文件切割上传功能示例
2020/03/03 PHP
jQuery 操作XML入门
2008/12/25 Javascript
JQuery UI皮肤定制
2009/07/27 Javascript
jQuery中将函数赋值给变量的调用方法
2012/03/23 Javascript
AngularJs 国际化(I18n/L10n)详解
2016/09/01 Javascript
bootstrap导航栏、下拉菜单、表单的简单应用实例解析
2017/01/06 Javascript
vue loadmore 组件滑动加载更多源码解析
2017/07/19 Javascript
React/Redux应用使用Async/Await的方法
2017/11/16 Javascript
vue中keep-alive、activated的探讨和使用详解
2020/07/26 Javascript
python绘制铅球的运行轨迹代码分享
2017/11/14 Python
python如何在列表、字典中筛选数据
2018/03/19 Python
Python中文件的写入读取以及附加文字方法
2019/01/23 Python
python程序控制NAO机器人行走
2019/04/29 Python
python模块常用用法实例详解
2019/10/17 Python
keras模型保存为tensorflow的二进制模型方式
2020/05/25 Python
使用Python制作一个数据预处理小工具(多种操作一键完成)
2021/02/07 Python
彼得罗夫美国官网:Peter Thomas Roth美国(青瓜面膜)
2017/11/05 全球购物
俄罗斯领先的移动和数字设备在线商店:Svyaznoy.ru
2020/12/21 全球购物
用缩写的指针比较"if(p)" 检查空指针是否可靠?如果空指针的内部表达不是0会怎么样?
2014/01/05 面试题
什么是Oracle的后台进程background processes?都有哪些后台进程?
2012/04/26 面试题
应届生财务会计求职信
2013/11/05 职场文书
计算机应用与科学个人的自我评价
2013/11/15 职场文书
前台接待员岗位职责
2014/01/02 职场文书
三八妇女节慰问信
2015/02/14 职场文书
休学证明范本
2015/06/19 职场文书
2019职场单身人才调研报告:互联网行业单身比例最高
2019/08/07 职场文书
pycharm 如何查看某一函数源码的快捷键
2021/05/12 Python
python编程项目中线上问题排查与解决
2021/11/01 Python