js 基础对象一

JavaScript 通常用于操作 HTML 元素。

Document元素

每个载入浏览器的 HTML 文档都会成为 Document 对象。

Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。

1：通过id来操作html代码：

<!DOCTYPE html>

<html>

<body>

<h1>My First Web Page</h1>

<p id="demo">My First Paragraph</p>

<script>

document.getElementById("demo").innerHTML="My First JavaScript";

</script>

</body>

</html>

2：写到文档输出

<!DOCTYPE html>

<html>

<body>

<h1>My First Web Page</h1>

<script>

document.write("<p>My First JavaScript</p>");

</script>

</body>

</html>

3：警告

请使用 document.write() 仅仅向文档输出写内容。

如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖：

<!DOCTYPE html>

<html>

<body>

<h1>My First Web Page</h1>

<p>My First Paragraph.</p>

<button onclick="myFunction()">点击这里</button>

<script>

function myFunction()

{

document.write("糟糕！文档消失了。");

}

</script>

</body>

</html>

浏览器对象模型： Browser 对象------------------------------------------------------------------------------------浏览器对象模型 js brower模型

浏览器对象模型 (BOM) 使 JavaScript 有能力与浏览器“对话”

1 Window 对象

Window 对象表示浏览器中打开的窗口。（Window 对象表示一个浏览器窗口或一个框架）

如果文档包含框架（frame 或 iframe 标签），浏览器会为 HTML 文档创建一个 window 对象，并为每个框架创建一个额外的 window 对象。

2 Navigator 对象

Navigator 对象包含有关浏览器的信息。

3 Screen 对象

Screen 对象包含有关客户端显示屏幕的信息。

4 History 对象

History 对象包含用户（在浏览器窗口中）访问过的 URL。

History 对象是 window 对象的一部分，可通过 window.history 属性对其进行访问。

5 Location 对象

Location 对象包含有关当前 URL 的信息。

Location 对象是 Window 对象的一个部分，可通过 window.location 属性来访问。

HTML DOM （文档对象模型） DOM 对象---------------------------------------------------------------------------文档对象模型 js html dom模型

文档对象模型 (DOM) 使 JavaScript 有能力与html“对话”

1 DOM Document
2 DOM Element
3 DOM Attribute
4 DOM Event
什么是 HTML DOM？

HTML DOM 是：
- HTML 的标准对象模型
- HTML 的标准编程接口
- W3C 标准
HTML DOM 定义了所有 HTML 元素的对象和属性，以及访问它们的方法。

换言之，HTML DOM 是关于如何获取、修改、添加或删除 HTML 元素的标准。

HTML DOM 允许 JavaScript 改变 HTML 元素的内容

HTML DOM 允许 JavaScript 改变 HTML 元素的样式。(CSS)

HTML DOM 使 JavaScript 有能力对 HTML 事件做出反应。

HTML DOM 允许 JavaScript 添加和删除节点（HTML 元素）。

1 Document 对象

每个载入浏览器的 HTML 文档都会成为 Document 对象。

Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。

2 Element 对象

在 HTML DOM 中，Element 对象表示 HTML 元素。

Element 对象可以拥有类型为元素节点、文本节点、注释节点的子节点。

NodeList 对象表示节点列表，比如 HTML 元素的子节点集合。

3 Attr 对象

在 HTML DOM 中，Attr 对象表示 HTML 属性。

HTML 属性始终属于 HTML 元素。

4 Event 对象

Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。

事件通常与函数结合使用，函数不会在事件发生前被执行！