JavaScript基础与DOM编程：window对象与动态改变HTML内容

需积分: 12 201 浏览量更新于2024-07-12 收藏 1.65MB PPT 举报

"常见错误-js基础学习第一章与第二章" 在JavaScript基础学习中，常见错误主要包括对页面布局的理解和DOM操作的掌握。在第一章中，提到了几个常见的问题和解决方案： 1. **设置下拉菜单默认选中**：在HTML的`<SELECT>`标签中，如果想要设置第一项为默认选中，可以在相应的`<OPTION>`标签中添加`selected`属性，例如： ```html <SELECT name="selTopic" id="selPTopic"> <OPTION value="gard.html" selected>网上谈兵</OPTION>  </SELECT> ``` 2. **页面内容居中**：可以使用CSS实现水平居中，如设置`margin: 0 auto`来让元素在父容器中水平居中： ```css .centered-content { margin: 0 auto; width: /* 设置元素的宽度 */; } ``` 3. **表格居中并全屏**：可以设置表格的`width`和`height`为100%，并使用CSS调整内外边距实现居中： ```html <table style="width: 100%; height: 100%; margin: auto;">  </table> ``` 第二章主要讲解了DOM编程和window对象： - **DOM编程**：DOM（Document Object Model）是HTML和XML文档的结构模型，它将文档中的每个部分都表示为一个节点，允许通过JavaScript或其它脚本语言动态地访问和更新文档内容。在示例中，通过`getElementById`方法改变了链接的文本和URL，展示了DOM操作的基本应用。 - **window对象**：是浏览器中的全局对象，代表整个浏览器窗口。它包含了许多与页面交互的方法和属性，如`open()`用于打开新的窗口，`setTimeout()`用于延迟执行函数。例如，`setTimeout(function, delay)`会在延迟`delay`毫秒后执行传入的函数。 - **预习检查**：询问了关于脚本执行原理、JavaScript控制语句（如if、for、while等）、有参函数的创建与调用、以及DOM中的名词理解（根节点、子节点、相邻节点）。 - **本章任务**：包括演示广告窗口特效和时钟显示特效的制作，要求掌握`window.open()`和`setTimeout()`的应用，以及利用DOM动态改变HTML内容。 - **HTML文档的树状结构**：HTML文档构成了一棵以`<html>`标签为根节点的树形结构，其中`<head>`和`<body>`是根节点的子节点，而元素之间则存在父子、相邻等关系。 - **动态改变HTML内容**：通过`Document`对象的方法，如`getElementById`和属性访问，可以修改HTML元素的内容和属性。在示例中，`changeLink()`函数改变了id为`myAnchor`的`<a>`标签的文本和链接地址。通过以上学习，开发者可以更好地理解和操作JavaScript中的DOM，实现页面的动态效果和用户交互。

速本

粉丝: 20
资源: 2万+

JavaScript基础与DOM编程：window对象与动态改变HTML内容

JavaScript第1章的所有答案

前端开发基础入门教程 JavaScript语言编程基础教程 第1章 JavaScript基础 共49页.pptx

Ember js in action 样张 第一章

javascript基础第一章 JavaScript与用户端

eloquent-javascript--ch4-exercises:eloquent javascript 第 4 章的练习

JavaScript DOM 学习第二章 编辑文本

javascript开发技术大全－第3章 js数据类型

实战突击：PHP项目开发案例整合-配套源码【第五章在线论坛系统】

实战突击：PHP项目开发案例整合-配套源码【第三章在线投票系统】

desafio03-ignite-corigindo-o-codigo:第1章

最新资源

前端开发基础入门教程 JavaScript语言编程基础教程第1章 JavaScript基础共49页.pptx

Ember js in action 样张第一章

JavaScript DOM 学习第二章编辑文本