简述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 相关文章推荐
cnblogs中在闪存中屏蔽某人的实现代码
Nov 14 Javascript
Js实现手机发送验证码时按钮延迟操作
Jun 20 Javascript
js自动生成的元素与页面原有元素发生堆叠的解决方法
Sep 04 Javascript
Angularjs全局变量被作用域监听的正确姿势
Feb 06 Javascript
谈谈JavaScript数组常用方法总结
Jan 24 Javascript
详谈Node.js之操作文件系统
Aug 29 Javascript
详解vue.js下引入百度地图jsApi的两种方法
Jul 27 Javascript
jQuery 点击获取验证码按钮及倒计时功能
Sep 20 jQuery
angularjs使用div模拟textarea文本框的方法
Oct 02 Javascript
JS简单表单验证功能完整示例
Jan 26 Javascript
基于JS实现视频上传显示进度条
May 12 Javascript
微信小程序实现带放大效果的轮播图
May 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发送get、post请求的6种方法简明总结
2014/07/08 PHP
php微信开发之关注事件
2018/06/14 PHP
PHP实现微信商户支付企业付款到零钱功能
2018/09/30 PHP
yii2 url重写并隐藏index.php方法
2018/12/10 PHP
UserData用法总结 lanyu出品
2010/07/01 Javascript
浅谈Javascript鼠标和滚轮事件
2012/06/27 Javascript
JS获取浏览器版本及名称实现函数
2013/04/02 Javascript
js关于字符长度限制的问题示例探讨
2014/01/24 Javascript
JS实现选项卡实例详解
2015/11/17 Javascript
JavaScript如何禁止Backspace键
2015/12/02 Javascript
Bootstrap每天必学之工具提示(Tooltip)插件
2016/04/26 Javascript
Javascript中的对象和原型(二)
2016/08/12 Javascript
AngularJs IE Compatibility 兼容老版本IE
2016/09/01 Javascript
Angular ng-repeat 对象和数组遍历实例
2016/09/14 Javascript
微信小程序 实例应用(记账)详解
2016/09/28 Javascript
通过BootStrap-select插件 js jQuery控制select属性变化
2017/01/03 Javascript
vue基于viewer实现的图片查看器功能
2019/04/12 Javascript
vue element-ui实现input输入框金额数字添加千分位
2019/12/29 Javascript
Python实现二分查找算法实例
2015/05/26 Python
Python 字符串大小写转换的简单实例
2017/01/21 Python
python进阶_浅谈面向对象进阶
2017/08/17 Python
Python编程之gui程序实现简单文件浏览器代码
2017/12/08 Python
Python使用pyodbc访问数据库操作方法详解
2018/07/05 Python
PyTorch的SoftMax交叉熵损失和梯度用法
2020/01/15 Python
tensorflow 变长序列存储实例
2020/01/20 Python
python matplotlib.pyplot.plot()参数用法
2020/04/14 Python
python 制作磁力搜索工具
2021/03/04 Python
AmazeUI 按钮交互的实现示例
2020/08/24 HTML / CSS
KLOOK客路:发现更好玩的世界,预订独一无二的旅行体验
2016/12/16 全球购物
建设单位项目负责人任命书
2014/06/06 职场文书
经济贸易系求职信
2014/08/04 职场文书
高中国旗下的演讲稿
2014/08/28 职场文书
学生未请假就回家检讨书
2014/09/22 职场文书
600字作文之感受大自然
2019/11/27 职场文书
如何解决springcloud feign 首次调用100%失败的问题
2021/06/23 Java/Android
javascript对象3个属性特征
2021/11/17 Javascript