javascript学习基础笔记之DOM对象操作


Posted in Javascript onNovember 03, 2011

DOM文档对象模型是HTML和XML的应用程序接口(API),DOM将整个页面规划成由节点层次构成的文档。DOM对象给予开发者对HTML的访问权限,并且使开发者能将HTML作为XML文档来处理和查看。DOM对象是与语言无关的API,意味着它的实现并不是与javascript绑定,这在于初学者来说可能会理解错误。DOM是针对XML的基于树的API,它关注的不仅仅是解析XML代码,而是用一系列相互关联的对象来表示这些代码,而这些对象可以被修改,而且无需重新解析代码就能直接访问它们。由于DOM的使用上的简便,因此它成为了Web浏览器和javascript最喜欢的方法。document对象是BOM的对象,即window.document==document,但是它又同时属于DOM,也是HTML DOM的HTMLDocument对象的一种表现形式,反过来说它也是XML DOM Document对象。

JavaScript中的大部分处理DOM的过程都是利用document对象。

要访问html元素,可以利用document的documentElement特性:

var oHtml=document.documentElement;

oHtml对象包含一个表示<html/>的HTMLElement对象,通过:

var oHead=oHtml.firstChild;

var oBody=oHtml.lastChild;

可以得到分别表示<head/>和<body/>的对象,也可以通过使用childNodes特性来完成:

var oHead=oHtml.childNodes[0];//将childNodes当做Array来使用;

var oBody=oHtml.childNodes[1];//将childNodes当做Array来使用;

上述表达可以使用更加正规的表达方式,那就是shiyongitem()方法:

var oHead=oHtml.childNodes.item(0);

var oBody=oHtml.childNodes.item(1);

其实在HTML页DOM对象定义了document.body作为指向<body/>元素的指针,即

oBody = document.body;

但是document.head却没有定义,它的返回值是undefined;

Javascript 相关文章推荐
jquery的颜色选择插件实例代码
Oct 02 Javascript
js查错流程归纳
May 04 Javascript
使用jQuery Ajax功能时需要注意的一个问题(内存溢出)
May 30 Javascript
JQuery触发radio或checkbox的change事件
Dec 18 Javascript
使用JavaScript 实现对象 匀速/变速运动的方法
May 08 Javascript
基于JavaScript实现Json数据根据某个字段进行排序
Nov 24 Javascript
javascript瀑布流布局实现方法详解
Feb 17 Javascript
BootStrap的table表头固定tbody滚动的实例代码
Aug 24 Javascript
Angular 1.x个人使用的经验小结
Jul 19 Javascript
node实现分片下载的示例代码
Oct 17 Javascript
彻底弄懂 JavaScript 执行机制
Oct 23 Javascript
JS实现将对象转化为数组的方法分析
Jan 21 Javascript
40款非常棒的jQuery 插件和制作教程(系列二)
Nov 02 #Javascript
遍历jquery对象的代码分享
Nov 02 #Javascript
jquery 笔记 事件
Nov 02 #Javascript
分页栏的web标准实现
Nov 01 #Javascript
jquery键盘事件使用介绍
Nov 01 #Javascript
JS鼠标事件大全 推荐收藏
Nov 01 #Javascript
EasyUI中的tree用法介绍
Nov 01 #Javascript
You might like
基于mysql的论坛(3)
2006/10/09 PHP
QueryPath PHP 中的jQuery
2010/04/11 PHP
PHP5中实现多态的两种方法实例分享
2014/04/21 PHP
在Windows系统下使用PHP生成Word文档的教程
2015/07/03 PHP
php面向对象与面向过程两种方法给图片添加文字水印
2015/08/26 PHP
解读PHP中上传文件的处理问题
2016/05/29 PHP
js 设置选中行的样式的实现代码
2010/05/24 Javascript
关于hashchangebroker和statehashable的补充文档
2011/08/08 Javascript
javascript中数组的多种定义方法和常用函数简介
2014/05/09 Javascript
使用documentElement正确取得当前可见区域的大小
2014/07/25 Javascript
jquery实现右侧栏菜单选择操作
2016/03/04 Javascript
JS/jQ实现免费获取手机验证码倒计时效果
2016/06/13 Javascript
纯JS打造网页中checkbox和radio的美化效果
2016/10/13 Javascript
Bootstrap笔记—折叠实例代码
2017/03/13 Javascript
详解angularJs模块ui-router之状态嵌套和视图嵌套
2017/04/28 Javascript
解决浏览器会自动填充密码的问题
2017/04/28 Javascript
微信公众号获取用户地理位置并列出附近的门店的示例代码
2019/07/25 Javascript
vue中实现拖动调整左右两侧div的宽度的示例代码
2020/07/22 Javascript
electron踩坑之dialog中的callback解决
2020/10/06 Javascript
Python爬虫框架Scrapy安装使用步骤
2014/04/01 Python
python抓取网页时字符集转换问题处理方案分享
2014/06/19 Python
详解pandas删除缺失数据(pd.dropna()方法)
2019/06/25 Python
python os.fork() 循环输出方法
2019/08/08 Python
浅谈pycharm使用及设置方法
2019/09/09 Python
基于Python检测动态物体颜色过程解析
2019/12/04 Python
简单了解为什么python函数后有多个括号
2019/12/19 Python
Html+Css+Jquery实现左侧滑动拉伸导航菜单栏的示例代码
2020/03/17 HTML / CSS
杭州信雅达系统.NET工程师面试试题
2015/02/08 面试题
音乐教学案例
2014/01/30 职场文书
公务员转正鉴定材料
2014/02/11 职场文书
教师远程培训感言
2014/03/06 职场文书
网络工程专业自荐信范文
2014/03/16 职场文书
交通事故协议书范文
2014/04/16 职场文书
关于随地扔垃圾的检讨书
2014/09/30 职场文书
中秋节英文祝福语句(14句)
2019/09/11 职场文书
如何在python中实现ECDSA你知道吗
2021/11/23 Python