这是JavaScript的总结资源-CSDN文库

需积分: 6 101 浏览量 2011-12-05 22:39:03 上传评论收藏 5KB TXT 举报

### JavaScript核心知识点总结 #### 一、JavaScript简介与特点 **标题**：“这是JavaScript的总结” **描述**：这是ACCP5.0 S2阶段关于JavaScript的一些总结，内容包括JavaScript的基础概念及其在网页中的应用。 JavaScript是一种广泛使用的脚本语言，它主要被用于Web开发中以增强网页的交互性。JavaScript的特点包括： 1. **弱类型**：变量无需提前声明类型，可以直接赋值。 2. **动态性**：变量可以随时更改类型或值。 3. **基于对象**：虽然不是纯面向对象的语言，但支持创建和操作对象。 4. **事件驱动**：可以通过事件来触发函数执行。 5. **轻量级**：主要运行在客户端浏览器上，不占用服务器资源。 #### 二、文档对象模型（DOM） **标签**：“兴趣爱好的朋友们来看看” DOM，即Document Object Model（文档对象模型），是W3C组织提出的一个标准，用于表示和控制HTML文档的结构。DOM将HTML文档视为一个树形结构，其中每个节点都是一个文档对象。通过DOM，开发者可以修改页面的内容、结构和样式。 1. **基本概念**： - **`window`对象**：代表浏览器窗口，是所有JavaScript全局对象、函数以及变量的父对象。 - **`document`对象**：表示整个HTML文档，是DOM的核心，提供了许多用于操作文档的方法和属性。 2. **常用方法**： - **`getElementById()`**：根据元素ID获取该元素。 - **`getElementsByName()`**：根据元素名称获取一组元素。 - **`querySelector()`和`querySelectorAll()`**：更现代的选择器方法，可以使用CSS选择器语法来获取元素。 3. **示例**： ```javascript var element = document.getElementById("someId"); // 获取id为someId的元素 var elements = document.getElementsByName("someName"); // 获取name为someName的所有元素 ``` #### 三、CSS样式 CSS（层叠样式表）是用来定义HTML元素如何显示的样式规则。通过JavaScript可以动态地改变元素的样式。 1. **内联样式**：直接写在HTML标签内。 2. **内部样式表**：写在`<style>`标签内，位于文档的`<head>`部分。 3. **外部样式表**：保存在单独的.css文件中，并通过`<link>`标签链接到HTML文档。 **示例代码**： ```html  <input type="text" style="border-width: 1px; border-style: solid;" name="textname">  <link rel="stylesheet" href="styles.css" type="text/css">  function changeColor(color) { var txt = document.getElementsByName("txtname")[0]; txt.style.borderColor = color; // 改变边框颜色 } ``` #### 四、元素选取与样式操作在JavaScript中，可以通过多种方式选取HTML元素，并对其样式进行操作。 1. **选取元素**： - `document.getElementById("elementId")`：通过ID选取元素。 - `document.getElementsByName("elementName")`：通过名称选取元素。 - `document.all["elementId"]`：选取元素（IE浏览器专用）。 2. **样式操作**： - `style`属性：可以直接修改元素的CSS样式。 - `classList`属性：添加或删除类名。 **示例代码**： ```javascript function checkForm() { var value = document.all['txtName'].value; alert(value.length); } // 改变表单提交地址 if (checkForm()) { var form = document.all["myform"]; form.action = "c.html"; form.submit(); } ``` #### 五、事件处理 JavaScript中常见的事件包括键盘事件、鼠标事件等。通过事件处理函数可以在特定条件下执行代码。 1. **键盘事件**： - `keydown`：按下键时触发。 - `keyup`：释放键时触发。 - `keypress`：持续按键时触发。 2. **鼠标事件**： - `onclick`：点击时触发。 - `onmouseover`/`onmouseout`：鼠标悬停/移出时触发。 3. **表单验证**： - 使用`onsubmit`事件处理函数对表单输入进行验证。 **示例代码**： ```html <form name="myform" onsubmit="return validateForm()"> <input type="text" name="txtName"> <input type="submit" value="提交"> </form> <script type="text/javascript"> function validateForm() { var value = document.all['txtName'].value; if (value.length == 0) { alert("请输入内容"); return false; // 阻止表单提交 } return true; // 允许表单提交 } </script> ``` 以上就是关于JavaScript的一些基础知识和常用技巧的总结。希望这些内容能帮助初学者更好地理解和掌握JavaScript。

资源推荐

资源详情

资源评论

T1javascript的基本语法

脚本的基本结构<script type=”text/javascript”></script>

javascript的基本语法(变量的声明和赋值，运算符号，逻辑控制语句，注释和类型转换，与java类似)

自定义函数 àfunction

javascript是一种描述性语言，也是一种基于对象(Object)和事件驱动(Event Driver), 并具有安全性能的脚本语言。

javascript应用程序都要下载到浏览器的客户端执行。

T2DOM编程―window对象

l 运用DOM模型查找某个HTML元素

2 运用window对象的Open()方法制作各种样式的广告窗体

3 使用window对象的setTimeout()方法和Date对象制作日期显示效果

DOM-Document Object Model,它是W3C国际组织的一套Web标准。它定义访问HTML文档对象的一套属性、方法和事件。

Window窗口对象是所有页面内容的根对象。

T3DOM编程-document对象

document对象表示浏览器中显示的HTML文档

document对象的属性bgColor用来设置文档的背景颜色；