Javascript 帮助我理解DOM中的对象

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

我学到的是文档中的所有内容都是对象

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

打字

如果我们看一下这个例子，

form

是一个具有属性

name

和

action

的对象吗

但是

name

和

action

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

对象元素和节点之间的区别是什么

我知道html、css、javascript和dom的基础知识。但是有人能给我描述一下这些部分是如何相互交流的吗

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

HTML属性公开为 元素对象上的属性

元素=对象，属性=属性。方法只是一个invocable属性，例如onclick

<form
onsubmit="alert('hi');"
id="contact-form"
>

---

onsubmit

是一个方法，

id

是一个属性，

form

是一个节点，节点类型为1，这意味着它是一个HTMLElement并继承通用HTML属性。

在您的示例中，名称和操作是表单对象的属性。 如果在JSP页面中有类似的内容

<form name="frm" action="somepage.jsp" onSubmit=" return validateForm();">
  <input type="text" name="txtField" id="txtField"></input>
  <input type="submit" value="submit"></input>
</form>

还有一个js函数，定义如下，用于检查文本框中是否输入了任何文本

<script>
  function validateForm(){
    if(document.frm.txtField.value="")
       return false;
    else
       return true;
  }
 </script>

函数validateForm（）{
if（document.frm.txtField.value=”“）
返回false；
其他的
返回true；
}

---

您可以使用document对象访问dom中的form对象，并从中访问表单持有的输入元素。

在我看来，您的问题在于不理解面向对象编程背后的概念。JavaScript是一种面向对象的语言。你可能应该去看医生

不过，简单地说，对象是封装数据（您所指的“属性”）和功能（您可以要求对象执行的“方法”或“功能”）的一种方式

在JavaScriptDOM中，有一个对象树，其中每个对象都包含本身就是对象的属性。因此，您可以拥有一个表单对象，其中包含onSubmit（）等方法和“elements”等属性，后者是表单字段的数组。数组中的每个元素都是另一个对象，比如TextField对象或复选框

现在你知道了物体。关于对象的一点是，它们可以从对象的父类继承属性。例如，在JavaScript中，有一个元素类，每个表单字段对象都是元素类的“子类”的实例。所以，由于元素定义了“name”属性，TextField和Checkbox以及它们的所有朋友都从元素继承，所以它们也都自动拥有这个“name”属性

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

请注意，HTML自然是树状结构：HTML标记包含头和体，头标记包含标题、元和脚本标记，元标记包含名称和内容等属性。所有这些都由浏览器排列成一个对象树，这就是使用JavaScript进行DOM编程时要处理的内容

概括地说：对象是JavaScript中数据和功能的基本表示形式。元素是对象的特定类，是“元素”类的子类，表示某种形式的字段。这些可以在form.elements数组中找到，该数组是form对象的属性。最后，节点是组成网页的标记、文本、脚本和其他对象树中的点

---

希望有帮助

我以前教过人们关于DOM的知识，并发现看到DOM的实际应用是非常重要的

如果你没有火虫，就去找它。

当然，在重新启动Firefox之后

打开任何网页并右键单击某个内容，将出现一个名为“Inspect Element”的选项。这将显示页面的呈现代码。当我说rendered时，我指的是被任何javascript修改后的页面，与标准源代码不同，标准源代码只是从服务器发送的纯HTML

您正在检查的图元将高亮显示。现在，右键单击突出显示的元素并选择“在DOM选项卡中检查”

进入DOM选项卡后，将显示所检查元素的所有属性。在这里，您可以看到元素的属性，比如type=“input”，元素的方法，比如focus（），可能是定制原型，Firefox专有属性，等等

这里有一些方法、函数和属性，请在Mozilla开发者中心查找。花些时间编写脚本，让您在DOM中移动，并允许您使用这些脚本对其进行更改，而不要使用innerHTML做任何事情

• createElement
• createTextNode
• 附肢儿童
• 插入之前
• 除去孩子
• 克隆节点
• 集合属性
• 删除属性
• getElementById
• getElementsByTagName
• 子节点
• 长子
• 最后一个孩子
• 下一步
• hasChildNodes
• 标记名
• 附件（IE）/附件列表（所有其他）
• detachEvent（IE）/removeEventListener（所有其他）

---

你弄糊涂了。元素！=对象（{}不是元素），属性！=属性元素和属性是DOM的术语，对象和属性是JS的术语。一个好的答案可以解释这一点以及