JavaScript W3CSchool 学习笔记

最新推荐文章于 2022-04-21 18:00:32 发布

weizero

最新推荐文章于 2022-04-21 18:00:32 发布

阅读量156

点赞数

分类专栏： Web 文章标签： JavaScript ViewUI

本文链接：https://blog.csdn.net/weizero/article/details/84355391

版权

Web 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

1. 什么是 JavaScript？
JavaScript 被设计用来向 HTML 页面添加交互行为。
JavaScript 是一种脚本语言（脚本语言是一种轻量级的编程语言）。
JavaScript 由数行可执行计算机代码组成。
JavaScript 通常被直接嵌入 HTML 页面。
JavaScript 是一种解释性语言（就是说，代码执行不进行预编译）。
所有的人无需购买许可证均可使用 JavaScript。
JavaScript 是面向对象的编程语言 (OOP)。

2. JavaScript 能做什么？
JavaScript 为 HTML 设计师提供了一种编程工具
    HTML 创作者往往都不是程序员，但是JavaScript却是一种只拥有极其简单的语法的脚本语言！
    几乎每个人都有能力将短小的代码片断放入他们的 HTML 页面当中。
JavaScript 可以将动态的文本放入 HTML 页面
    类似于这样的一段 JavaScript声明可以将一段可变的文本放入 HTML 页面：
    document.write("<h1>" + name + "</h1>")
JavaScript 可以对事件作出响应
    可以将 JavaScript 设置为当某事件发生时才会被执行，
    例如页面载入完成或者当用户点击某个 HTML 元素时。
JavaScript 可以读写 HTML 元素
    JavaScript 可以读取及改变 HTML 元素的内容。
JavaScript 可被用来验证数据
    在数据被提交到服务器之前，JavaScript 可被用来验证这些数据。
JavaScript 可被用来检测访问者的浏览器
    JavaScript 可被用来检测访问者的浏览器，并根据所检测到的浏览器，为这个浏览器载入相应的页面。
JavaScript 可被用来创建 cookies
    JavaScript 可被用来存储和取回位于访问者的计算机中的信息。

3. 如何插入JavaScript？
<script type="text/javascript">
...
</script>

4. 使用外部JavaScript？
<script src="xxx.js">....</script>

5. JavaScript 变量名称的规则：
变量对大小写敏感（y 和 Y 是两个不同的变量）
变量必须以字母或下划线开始
注释：由于 JavaScript 对大小写敏感，变量名也对大小写敏感。

6. 重新声明 JavaScript 变量
如果您再次声明了 JavaScript 变量，该变量也不会丢失其原始值。
var x=5;
var x;
在以上语句执行后，变量 x 的值仍然是 5。在重新声明该变量时，x 的值不会被重置或清除。

7. 全等
=== 全等（值和类型）

8. <script>插入<body> 部分和 <head> 部分均可

9. switch 后面的 (n) 可以是表达式，也可以（并通常）是变量

10. 警告框
警告框经常用于确保用户可以得到某些信息。
当警告框出现后，用户需要点击确定按钮才能继续进行操作。
语法：
alert("文本");

11. 确认框
确认框用于使用户可以验证或者接受某些信息。
当确认框出现后，用户需要点击确定或者取消按钮才能继续进行操作。
如果用户点击确认，那么返回值为 true。如果用户点击取消，那么返回值为 false。
语法：
confirm("文本");

12. 提示框
提示框经常用于提示用户在进入页面前输入某个值。
当提示框出现后，用户需要输入某个值，然后点击确认或取消按钮才能继续操纵。
如果用户点击确认，那么返回值为输入的值。如果用户点击取消，那么返回值为 null。
语法：
prompt("文本","默认值");

13. 函数
将脚本编写为函数，就可以避免页面载入时执行该脚本。
函数包含着一些代码，这些代码只能被事件激活，或者在函数被调用时才会执行。
你可以在页面中的任何位置调用脚本（如果函数嵌入一个外部的 .js 文件，
那么甚至可以从其他的页面中调用）。
函数在页面起始位置定义，即 <head> 部分。
创建函数的语法：
function 函数名(var1,var2,...,varX) {
代码．．．
}

14. for-in
语法：
for (变量 in 对象)
{
    在此执行代码
}
注意：当对象是数组时，变量值是数组的index.

15. onload 和 onUnload
当用户进入或离开页面时就会触发 onload 和 onUnload 事件。
onload 事件常用来检测访问者的浏览器类型和版本，然后根据这些信息载入特定版本的网页。
onload 和 onUnload 事件也常被用来处理用户进入或离开页面时所建立的 cookies

16. onFocus, onBlur 和 onChange
onFocus、onBlur 和 onChange 事件通常相互配合用来验证表单。
下面是一个使用 onChange 事件的例子。用户一旦改变了域的内容，checkEmail() 函数就会被调用。
<input type="text" size="30" id="email" οnchange="checkEmail()">

17. onSubmit
onSubmit 用于在提交表单之前验证所有的表单域。
下面是一个使用 onSubmit 事件的例子。
当用户单击表单中的确认按钮时，checkForm() 函数就会被调用。
假若域的值无效，此次提交就会被取消。checkForm() 函数的返回值是 true 或者 false。
如果返回值为true，则提交表单，反之取消提交。
<form method="post" action="xxx.htm" οnsubmit="return checkForm()">

18. onMouseOver 和 onMouseOut
onMouseOver 和 onMouseOut 用来创建“动态的”按钮。
下面是一个使用 onMouseOver 事件的例子。
当 onMouseOver 事件被脚本侦测到时，就会弹出一个警告框：
<a href="http://www.w3school.com.cn"
οnmοuseοver="alert('An onMouseOver event');return false">
<img src="w3school.gif" width="100" height="30">
</a>

19. JavaScript捕获错误
有两种在网页中捕获错误的方法：
使用 try...catch 语句。(在 IE5+、Mozilla 1.0、和 Netscape 6 中可用)
使用 onerror 事件。这是用于捕获错误的老式方法。(Netscape 3 以后的版本可用)
（chrome、opera、safari 浏览器不支持onerror 事件）

20. Throw 声明
throw 声明的作用是创建 exception（异常）。
你可以把这个声明与 try...catch 声明配合使用，以达到控制程序流并产生精确错误消息的目的。
语法：
throw(exception)

21. OOP
虽然JavaScript 是面向对象的编程语言 (OOP），
但是只能用var来定义变量。
例如
Date d = new Date(); //错误
var d = new Date();

22. 定义数组
有两种向数组赋值的方法。
1:
var mycars=new Array()
mycars[0]="Saab"
mycars[1]="Volvo"
mycars[2]="BMW"
也可以使用一个整数自变量来控制数组的容量：
var mycars=new Array(3)
mycars[0]="Saab"
mycars[1]="Volvo"
mycars[2]="BMW"
2:
var mycars=new Array("Saab","Volvo","BMW")

23. Boolean
创建 Boolean 对象
使用关键词 new 来定义 Boolean 对象。下面的代码定义了一个名为 myBoolean 的逻辑对象：
var myBoolean=new Boolean()
注释：如果逻辑对象无初始值或者其值为 0、-0、null、""、false、undefined 或者 NaN，
那么对象的值为 false。否则，其值为 true（即使当自变量为字符串 "false" 时）！

24. 计时
1:
setTimeout() 未来的某时执行代码
var t=setTimeout("javascript语句", 毫秒);
setTimeout() 方法会返回某个值。在上面的语句中，值被储存在名为 t 的变量中。
假如你希望取消这个 setTimeout()，你可以使用这个变量名来指定它。
setTimeout() 的第一个参数是含有 JavaScript 语句的字符串。
这个语句可能诸如 "alert('5 seconds!')"，或者对函数的调用，诸如 alertMsg()"。
第二个参数指示从当前起多少毫秒后执行第一个参数。
2:
clearTimeout() 取消setTimeout()
clearTimeout(t);

25. 创建对象

在JS中，创建对象（Create Object）并不完全是我们时常说的创建类对象，JS中的对象强调的是一种复合类型，JS中创建对象及对对象的访问是极其灵活的。JS对象是一种复合类型，它允许你通过变量名存储和访问，换一种思路，对象是一个无序的属性集合，集合中的每一项都由名称和值组成（听起来是不是很像我们常听说的HASH表、字典、健/值对），而其中的值类型可能是内置类型(如number,string)，也可能是对象。

创建对象实例方式1：创建一个对象，声明其属性

虽然Object本身没有age这些属性，但是JS允许这样的方式创建对象实例，

这点与Java有明显的区别：

var personObj=new Object();
personObj.firstname="John";
personObj.lastname="Adams";
personObj.age=35;
personObj.eyecolor="black";

document.write(personObj.firstname);

创建对象实例方式2：用一对大括号括起来

上述2种创建对象实例的方法都不能使用new,

例如new personObj(), new myObj().

创建对象模板：用function关键字模拟Java的class关键字

function Person(firstname, lastname, age, eyecolor)
{
this.firstname=firstname
this.lastname=lastname
this.age=age
this.eyecolor=eyecolor
}

var boss = new Person("F", "L", "27", "black");

document.write(boss.firstname);