简述JavaScript对传统文档对象模型的支持


Posted in Javascript onJune 16, 2015

 这是将其在JavaScript语言早期版本中引入的模型。大家都被所有浏览器都支持,但只允许访问文件的某些关键部分,如表单,表单元素和图像。

该模型提供了若干个只读属性,如标题,URL和上次更改提供关于文档整体的信息。除了有由该模型可用于设置和获取文档的属性值提供各种方法。
文档属性在传统DOM:

下面是文档属性,可以使用传统DOM访问列表:

简述JavaScript对传统文档对象模型的支持

简述JavaScript对传统文档对象模型的支持

 文档方法在传统DOM:

这里是由传统DOM支持的方法列表:

简述JavaScript对传统文档对象模型的支持

 例子:

我们可以找到任何HTML元素,使用HTML DOM任何HTML文档。例如,如果一个网页文件包含一个表单元素,然后使用JavaScript,我们可以把它称为document.forms[0]。如果Web文档包括两个形式元素的第一种形式被称为document.forms[0]和第二为document.forms[1]。

利用上面给出的层次结构和性质,可以使用document.forms[0].elements[0]等。

下面是一个例子访问使用传统DOM方法文档属性:

<html>
<head>
<title> Document Title </title>
<script type="text/javascript">
<!--
function myFunc()
{
  var ret = document.title;
  alert("Document Title : " + ret );

  var ret = document.URL;
  alert("Document URL : " + ret );

  var ret = document.forms[0];
  alert("Document First Form : " + ret );

  var ret = document.forms[0].elements[1];
  alert("Second element : " + ret );

}
//-->
</script>
</head>
<body>
<h1 id="title">This is main title</h1>
<p>Click the following to see the result:</p>

<form name="FirstForm">
<input type="button" value="Click Me" onclick="myFunc();" />
<input type="button" value="Cancel">
</form>

<form name="SecondForm">
<input type="button" value="Don't ClickMe"/>
</form>

</body>
</html>

注意: 这个例子的形式和内容等返回对象,我们将不得不使用未在本教程中讨论这些对象的属性来访问它们的值。

Javascript 相关文章推荐
XRegExp 0.2: Now With Named Capture
Nov 30 Javascript
jquery load()在firefox(火狐)下显示不正常的解决方法
Apr 05 Javascript
JS小功能(操作Table--动态添加删除表格及数据)实现代码
Nov 28 Javascript
js实现完美兼容各大浏览器的人民币大小写相互转换
Oct 29 Javascript
跟我学习JScript的Bug与内存管理
Nov 18 Javascript
javascript实现数字倒计时特效
Mar 30 Javascript
js判断手机浏览器操作系统和微信浏览器的方法
Apr 30 Javascript
js替换字符串中所有指定的字符(实现代码)
Aug 17 Javascript
ES6记录异步函数的执行时间详解
Aug 31 Javascript
Js操作DOM元素及获取浏览器高宽的简单方法
Sep 08 Javascript
Vue 禁用浏览器的前进后退操作
Sep 04 Javascript
Vue+Element自定义纵向表格表头教程
Oct 26 Javascript
纯javascript实现四方向文本无缝滚动效果
Jun 16 #Javascript
Bootstrap基础学习
Jun 16 #Javascript
简述JavaScript的正则表达式中test()方法的使用
Jun 16 #Javascript
常用DOM整理
Jun 16 #Javascript
AngularJS学习笔记之ng-options指令
Jun 16 #Javascript
在JavaScript的正则表达式中使用exec()方法
Jun 16 #Javascript
JavaScript正则表达式之multiline属性的应用
Jun 16 #Javascript
You might like
一个PHP数组应该有多大的分析
2009/07/30 PHP
基于在生产环境中使用php性能测试工具xhprof的详解
2013/06/03 PHP
基于PHP+Ajax实现表单验证的详解
2013/06/25 PHP
php usort 使用用户自定义的比较函数对二维数组中的值进行排序
2017/05/02 PHP
使用WAMP搭建PHP本地开发环境
2017/05/10 PHP
基于jquery的时间段实现代码
2012/08/02 Javascript
jquery的ajax请求全面了解
2013/03/20 Javascript
js获取url中的参数且参数为中文时通过js解码
2014/03/19 Javascript
javascript实现回到顶部特效
2015/05/06 Javascript
Javascript表单特效之十大常用原理性样例代码大总结
2016/07/12 Javascript
Bootstrap Navbar Component实现响应式导航
2016/10/08 Javascript
JS实现的将html转为pdf功能【基于浏览器端插件jsPDF】
2018/02/06 Javascript
关于js陀螺仪的理解分析
2019/04/11 Javascript
聊聊Vue 中 title 的动态修改问题
2019/06/11 Javascript
小程序实现录音功能
2020/09/22 Javascript
[56:18]DOTA2上海特级锦标赛主赛事日 - 4 败者组第四轮#2 MVP.Phx VS Fnatic第二局
2016/03/05 DOTA
使用python统计文件行数示例分享
2014/02/21 Python
Python中的类学习笔记
2014/09/23 Python
浅析Python中的多重继承
2015/04/28 Python
使用pandas read_table读取csv文件的方法
2018/07/04 Python
Python使用pickle模块储存对象操作示例
2018/08/15 Python
python 实现的发送邮件模板【普通邮件、带附件、带图片邮件】
2019/07/06 Python
如何查看Django ORM执行的SQL语句的实现
2020/04/20 Python
Python字符串查找基本操作代码案例
2020/10/27 Python
pymysql模块使用简介与示例
2020/11/17 Python
使用gunicorn部署django项目的问题
2020/12/30 Python
使用CSS3和Checkbox实现JQuery的一些效果
2015/08/03 HTML / CSS
Soft Cotton捷克:来自爱琴海棉花的浴袍
2017/02/01 全球购物
什么是SCM(软件配置管理)
2014/08/16 面试题
项目副经理岗位职责
2013/12/30 职场文书
物理分数没达标检讨书
2014/09/13 职场文书
2015年宣传部工作总结范文
2015/03/31 职场文书
2015年村级财务管理制度
2015/08/04 职场文书
导游带团欢迎词
2015/09/30 职场文书
iPhone13再次曝光
2021/04/15 数码科技
微信小程序APP的生命周期及页面的生命周期
2022/04/19 Javascript