本文共 1431 字，大约阅读时间需要 4 分钟。

目录

-----前言

上两篇文章对 JavaScript 常用内置对象、数组等知识点和案例做了一些介绍演示，详细可参考博文：

这篇文章我们讲介绍：DHTML对象_window_document

-----知识点简介

四：DHTML 应用

分析：html, 触发事件, 脚本

1、DHTML 对象

window***

location:URL地址栏**

screen：屏幕*

history：历史访问记录*

navigator：浏览器*

event：事件***

document：文档***

2、window：表示整个窗口，窗口间的操作

对话框：

window.alert();

window.confirm();//确认

弹出窗口：

window.open(url,"name","width=200,heigh=300");

周期性定时器：周期性的执行某段代码

window.setInterval()

window.clearInterval()

一次性定时器

window.setTimeout(f,10)

window.clearTimeout

3、document对象

a、代表整个 html 文档，动态的操作页面元素，必须使用它

DOM 操作：节点树

b、找到元素节点

方式一：document.getElementById(id)---精确的查询单个元素对象，适用于元素已知

方式二：根据元素的层次位置查找

obj.parentNode---父节点

obj.childNodes---所有的子节点，包括标签，还包括空白

obj.lastChild/firstChild—

方式三：document.getElementsByTagName("input")---元素节点的数组，用于查询某种标签

obj.getElementsByTagName("input")---在obj的范围里进行查找

c、读取或者修改

规则一：将 HTML 标签对象化，html标记中的属性

<img src="a.jpg"/>---obj.src

<a href="a.html">click me</a>----obj.href

规则二：如果操作的是标记中间的文本

----obj.innerHTML

<p>aaa</p>

规则三：修改简单样式

obj.style.color

obj.style.backgroundColor

规则四：修改复杂样式

第一步：可以在 <style> 或者 CSS 文件中，定义样式类

第二步： js 代码中，

obj.className = "";

---------依然适用于节点类型已知

规则五：节点类型未知

obj.nodeName----得到节点的名称，全大写的形式

d、增加新元素节点

第一步：创建

var obj = document.createElement("a");---<a></a>

第二步：设置信息

obj.href = "";

obj.innerHTML = "";

第三步：加入某个位置

XXX.appendChild(obj);---追加子节点，最后一个

XXX.insertBefore(obj,XXX.firstChild);

XXX.insertBefore(obj,XXX.childNodes[2]);

e、删除节点

XXX.removeChild(obj);---obj必须是XXX的子节点

转载地址：https://blog.csdn.net/YuDBL/article/details/104246817 如侵犯您的版权，请留言回复原文章的地址，我们会给您删除此文章，给您带来不便请您谅解！