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 相关文章推荐
JavaScript URL参数读取改进版
Jan 16 Javascript
基于SVG的web页面图形绘制API介绍及编程演示
Jun 28 Javascript
jQuery实现的原图对比窗帘效果
Jun 15 Javascript
node.js中的fs.stat方法使用说明
Dec 16 Javascript
JS实现为排序好的字符串找出重复行的方法
Mar 02 Javascript
js实现div模拟模态对话框展现URL内容
May 27 Javascript
js addDqmForPP给标签内属性值加上双引号的函数
Dec 24 Javascript
vue.js 2.*项目环境搭建、运行、打包发布的详细步骤
May 01 Javascript
layui使用form表单实现post请求页面跳转的方法
Sep 14 Javascript
微信公众号开发之微信支付代码记录的实现
Oct 16 Javascript
vue实现评论列表功能
Oct 25 Javascript
javascript实现前端input密码输入强度验证
Jun 24 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
php并发对MYSQL造成压力的解决方法
2013/02/21 PHP
php+flash+jQuery多图片上传源码分享
2020/07/27 PHP
Gambit vs ForZe BO3 第二场 2.13
2021/03/10 DOTA
js中各浏览器中鼠标按键值的差异
2011/04/07 Javascript
P3P Header解决Cookie跨域的问题
2013/03/12 Javascript
使用vue.js开发时一些注意事项
2016/04/27 Javascript
jQuery表单验证插件解析(推荐)
2016/07/21 Javascript
BootStrap树状图显示功能
2016/11/24 Javascript
Angular2之二级路由详解
2018/08/31 Javascript
如何手动实现es5中的bind方法详解
2018/12/07 Javascript
Javascript基于OOP实实现探测器功能代码实例
2020/08/26 Javascript
vue封装自定义指令之动态显示title操作(溢出显示,不溢出不显示)
2020/11/12 Javascript
Python简单获取自身外网IP的方法
2016/09/18 Python
Python编程之微信推送模板消息功能示例
2017/08/21 Python
python os.listdir按文件存取时间顺序列出目录的实例
2018/10/21 Python
python使用ddt过程中遇到的问题及解决方案【推荐】
2018/10/29 Python
django使用admin站点上传图片的实例
2019/07/28 Python
使用Python实现正态分布、正态分布采样
2019/11/20 Python
Windows下Anaconda和PyCharm的安装与使用详解
2020/04/23 Python
python使用自定义钉钉机器人的示例代码
2020/06/24 Python
Python faker生成器生成虚拟数据代码实例
2020/07/20 Python
关于Python字符编码与二进制不得不说的一些事
2020/10/04 Python
纯CSS3实现Material Design效果
2017/03/09 HTML / CSS
利用CSS3实现进度条的两种姿势详解
2017/03/21 HTML / CSS
英国最大线上综合鞋类商城:Office
2017/12/08 全球购物
《石榴》教学反思
2014/03/02 职场文书
优质服务活动实施方案
2014/05/02 职场文书
软件售后服务方案
2014/05/29 职场文书
应届大专生自荐书
2014/06/16 职场文书
三问三解心得体会
2014/09/05 职场文书
领导干部“四风”查摆问题个人整改措施
2014/10/28 职场文书
学生会个人总结范文
2015/02/15 职场文书
离婚民事起诉状
2015/08/03 职场文书
《确定位置》教学反思
2016/02/18 职场文书
李清照的诗词赏析(20首)
2019/08/22 职场文书
《群青的幻想曲》京力秋树角色PV公开
2022/04/08 日漫