很抱歉现在才提到 DOM,这在 JS 教程里面可以算是一种异类了。但是我觉得这是有必要的。因为事先了解一点点程序的运行逻辑,可以少犯一点错误。有句话是这么说的,拿着一把锤子,看啥都想敲两下。JS 不是锤子,而是一个非常强大的工具,所以事先了解再步入,肯定会减少很多不必要的麻烦。
到这里我们的教程就是最后一章了。之后的如果有需要的内容,可能就需要大家通过自己去网上查找相应的文档进行学习了,我们不可能面面俱到,路还是要自己走的。
废话不多说,开始我们的内容吧!
我们之前好像已经提过了,但是已经时隔很久了,所以再讲一次。
应用程序接口(API,Application Programming Interface)是基于编程语言构建的结构,使开发人员更容易地创建复杂的功能。它们抽象了复杂的代码,并提供一些简单的接口规则直接使用。
来看一个现实中的例子:想想您的房子、公寓或其他住宅的供电方式,如果您想在您的房子里用电,只要把电器的插头插入插座就可以,而不是直接把它连接到电线上——要不然实在太可怕了。
同样,比如说,编程来显示一些3D图形,使用以更高级语言编写的 API (例如 JavaScript 或 Python )将会比直接编写直接控制计算机的GPU或其他图形功能的低级代码(比如 C 或 C++ )来执行操作要容易得多。
JavaScript 中有很多可用的API — 他们本身并不是 JavaScript 语言的一部分,却建立在 JavaScript 语言核心的顶部,为使用 JavaScript 代码提供额外的超强能力。他们通常分为两类:
浏览器内部的 API 又分这么多种:
<canvas>
元素中的像素数据以创建2D和3D场景的Canvas和WebGL。例如,您可以绘制矩形或圆形等形状,将图像导入到画布上,然后使用Canvas API对其应用滤镜(如棕褐色滤镜或灰度滤镜),或使用WebGL创建具有光照和纹理的复杂3D场景。这些API经常与用于创建动画循环的API(例如window.requestAnimationFrame())和其他API一起不断更新诸如动画和游戏之类的场景。我们要介绍的 DOM 就属于浏览器内部 API,并且已经几乎被作为 JS 的一部分看待。
API 通常是基于对象的。它们就像普通的对象一样,拥有各种方法,可以进行调用,然后做出你想要的事情来。
DOM 就是用来改变网页 HTML 的内容用的。这可以让你做很多光靠 HTML 本身做不到的事情。
在浏览器标签中当前载入的文档用一个 document
对象来表示。这个对象是一个树状结构。比如这个例子:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Simple DOM example</title>
</head>
<body>
<section>
<img src="dinosaur.png" alt="A red Tyrannosaurus Rex: A two legged dinosaur standing upright like a human, with small arms, and a large head with lots of sharp teeth.">
<p>Here we will add a link to the <a href="https://www.mozilla.org/">Mozilla homepage</a></p>
</section>
</body>
</html>
<< · Back Index ·>>