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

 更新时间:2015年06月16日 10:40:47   投稿:goldensun  
这篇文章主要介绍了简述JavaScript对传统文档对象模型的支持,是JS学习进阶中的重要知识,需要的朋友可以参考下

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

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

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

2015616103205974.jpg (662×762)

2015616103233946.jpg (655×726)

 文档方法在传统DOM:

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

2015616103255189.jpg (681×498)

 例子:

我们可以找到任何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基础_简单比较undefined和null 值

    Javascript基础_简单比较undefined和null 值

    下面小编就为大家带来一篇Javascript基础_简单比较undefined和null 值。小编觉得挺不错的,现在就分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2016-06-06
  • javascript学习笔记(一) 在html中使用javascript

    javascript学习笔记(一) 在html中使用javascript

    javascript学习笔记之在html中使用javascript 的方法,需要的朋友可以参考下
    2012-06-06
  • JavaScript进阶教程(第三课)

    JavaScript进阶教程(第三课)

    JavaScript进阶教程(第三课)...
    2007-04-04
  • JavaScript之数组扁平化详解

    JavaScript之数组扁平化详解

    这篇文章主要介绍了JavaScript之数组扁平化详解的方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,,需要的朋友可以参考下
    2019-06-06
  • JavaScript的事件流你了解吗

    JavaScript的事件流你了解吗

    这篇文章主要为大家介绍了JavaScript的事件流,具有一定的参考价值,感兴趣的小伙伴们可以参考一下,希望能够给你带来帮助<BR>
    2022-01-01
  • 完全不用基础的HTML5入门篇教程

    完全不用基础的HTML5入门篇教程

    HTML的全称为超文本标记语言,是一种标记语言。它包括一系列标签.通过这些标签可以将网络上的文档格式统一,使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本,HTML命令可以说明文字,图形、动画、声音、表格、链接等
    2022-03-03
  • JavaScript基础心法 数据类型

    JavaScript基础心法 数据类型

    一个很基础的知识点,这篇主要是介绍JavaScript中基本数据类型和引用数据类型是如何存储的,需要的朋友可以参考下
    2018-03-03
  • JavaScript基础之运算符

    JavaScript基础之运算符

    这篇文章主要介绍了如何理解JavaScript中的运算符,帮助大家更好的学习JavaScript,感兴趣的朋友可以了解下
    2021-11-11
  • 网页编辑器ckeditor和ckfinder配置步骤分享

    网页编辑器ckeditor和ckfinder配置步骤分享

    ckeditor+ckfinder配置用法,现在ckeditor是互联网上应用比较广泛的网页编辑器了,这里介绍下配置方法,需要的朋友可以参考下
    2012-05-05
  • javascript知识点收藏

    javascript知识点收藏

    javascript知识点收藏...
    2007-02-02

最新评论