javascript - 帮助我理解 DOM 中的对象

Question

我有一个关于 DOM 对象的问题。

我了解到文档中的所有内容都是对象？

<form name="myform" action="script.js">
    <input type="text">type something</input>
</form>

如果我们看一下这个例子，form 是一个具有属性 name 和 action 的对象吗？

但是 name 和 action 本身也是对象吗？我不太明白对象和属性之间的区别。

对象元素和节点有什么区别？

我了解 html、css、javascript 和 dom 的基础知识。但是谁能在这里为我描述一下这些部分如何相互通信的大局。

因为有太多的元素、属性和方法。所以我迷路了

Answer 1

在我看来，您的问题不在于理解面向对象编程背后的概念。 JavaScript 是一种面向对象的语言。你应该拿一个 quick tour of the concepts .

不过，简而言之，对象是一种封装数据(您指的“属性”)和功能(您可以要求对象执行的“方法”或“功能”)的方法。

在 JavaScript DOM 的情况下，有一棵对象树，其中每个对象都包含本身就是对象的属性。因此，您可以拥有一个带有 onSubmit() 等方法和“elements”等属性的 Form 对象，“elements”是一个表单字段数组。数组中的每个元素都是另一个对象，例如 TextField 对象或 Checkbox。

那么现在你了解了对象。关于对象的一件事是它们可以从对象的父类继承属性。例如，在 JavaScript 中，有一个 Element 类，每个表单域对象都是 Element 类“子类”的一个实例。因此，由于 Element 定义了“name”属性，而 TextField 和 Checkbox 以及它们的所有 friend 都继承自 Element，因此它们都自动拥有此“name”属性。

术语“节点”是指树或图形结构中的特定位置。在这种情况下，DOM(文档对象模型)定义了允许成为表示网页的树中节点的对象类型。对于您访问的每个网页，浏览器都会构建一个“DOM 树”，这是一个代表网页中每个元素的对象的大树。

请注意，HTML 自然是树状结构:html 标签包含 head 和 body，head 标签包含 title、meta 和 script 标签，meta 标签包含 name 和 content 等属性。所有这些都由浏览器排列成一棵对象树，这就是您在使用 JavaScript 进行 DOM 编程时所操纵的。

总结一下:对象是 JavaScript 中数据和功能的基本表示。元素是特定的对象类，它们是“元素”类的子类，代表某种形式的字段。这些可以在 form.elements 数组中找到，它是表单对象的一个​​属性。最后，节点是构成网页的标签、文本、脚本和其他对象树中的点。

希望对您有所帮助!