首页 > 代码库 > JavaScript基础的知识总结——[1]
JavaScript基础的知识总结——[1]
JavaScript 简介
JavaScript 是脚本语言
JavaScript 是一种轻量级的编程语言。
JavaScript 是可插入 HTML 页面的编程代码。
JavaScript 插入 HTML 页面后，可由所有的现代浏览器执行。
JavaScript 很容易学习。
下面是您将在本教程中学到的主要内容。
JavaScript：写入 HTML 输出
document.write("<h1>This is a heading</h1>");
JavaScript：对事件作出反应
<button type="button" onclick="alert(‘Welcome!‘)">点击这里</button>
JavaScript：改变 HTML 内容
x=document.getElementById("demo") //查找元素
x.innerHTML="Hello JavaScript"; //改变内容
JavaScript：改变 HTML 图像
<html>
<body>
<script>
function changeImage(){
element=document.getElementById(‘myimage‘)
if (element.src.match("bulbon")){
element.src="http://www.mamicode.com/i/eg_bulboff.gif";//图片灭
}else{
element.src="http://www.mamicode.com/i/eg_bulbon.gif"; //图片亮
}
}
</script>
<img id="myimage" onclick="changeImage()" src="http://www.mamicode.com/i/eg_bulboff.gif">
<p>点击灯泡来点亮或熄灭这盏灯</p>
</body>
</html>
JavaScript：改变 HTML 样式
x=document.getElementById("demo") //找到元素
x.style.color="#ff0000"; //改变样式
JavaScript：验证输入
if isNaN(x) {alert("Not Numeric")};
************************************
alert() 函数在 JavaScript 中并不常用，但它对于代码测试非常方便。
document.getElementByID("some id")。这个方法是 HTML DOM 中定义的。DOM（文档对象模型）是用以访问 HTML 元素的正式 W3C 标准。
JavaScript 能够改变任意 HTML 元素的大多数属性，而不仅仅是图片。
************************************
JavaScript 使用
<script> 标签
HTML 中的脚本必须位于 <script> 与 </script> 标签之间。
脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。
JavaScript 函数和事件
通常，我们需要在某个事件发生时执行代码，比如当用户点击按钮时。
如果我们把 JavaScript 代码放入函数中，就可以在事件发生时调用该函数。
外部的 JavaScript
也可以把脚本保存到外部文件中。外部文件通常包含被多个网页使用的代码。
外部 JavaScript 文件的文件扩展名是 .js。
如需使用外部文件，请在 <script> 标签的 "src" 属性中设置该 .js 文件：<script src="http://www.mamicode.com/myScript.js"></script>
************************************
浏览器会解释并执行位于 <script> 和 </script> 之间的 JavaScript。老旧的实例可能会在 <script> 标签中使用 type="text/javascript"。现在已经不必这样做了。
通常的做法是把函数放入 <head> 部分中，或者放在页面底部。这样就可以把它们安置到同一处位置，不会干扰页面的内容。
在 <head> 或 <body> 中引用脚本文件都是可以的。实际运行效果与您在 <script> 标签中编写脚本完全一致。
外部脚本不能包含 <script> 标签。
************************************
JavaScript 输出
操作 HTML 元素
从 JavaScript 访问某个 HTML 元素，您可以使用 document.getElementById(id) 方法：
document.getElementById("demo").innerHTML="My First JavaScript";
写到文档输出
下面的例子直接把 <p> 元素写到 HTML 文档输出中：
document.write("<p>My First JavaScript</p>");
Windows 8 中的 JavaScript
微软支持通过 JavaScript 创建 Windows 8 app。
************************************
JavaScript 由 web 浏览器来执行。在这种情况下，浏览器将访问 id="demo" 的 HTML 元素，并把它的内容（innerHTML）替换为 "My First JavaScript"。
请使用 document.write() 仅仅向文档输出写内容。如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖。
************************************
JavaScript 语句
分号 ;
分号用于分隔 JavaScript 语句。使用分号的另一用处是在一行中编写多条语句。
JavaScript 代码
JavaScript 代码（或者只有 JavaScript）是 JavaScript 语句的序列。浏览器会按照编写顺序来执行每条语句。
JavaScript 代码块
JavaScript 语句通过代码块的形式进行组合。块由左花括号开始，由右花括号结束。块的作用是使语句序列一起执行。
JavaScript 对大小写敏感。
当编写 JavaScript 语句时，请留意是否关闭大小写切换键。函数 getElementById 与 getElementbyID 是不同的。同样，变量 myVariable 与 MyVariable 也是不同的。
空格
JavaScript 会忽略多余的空格。您可以向脚本添加空格，来提高其可读性。
对代码行进行折行
您可以在文本字符串中使用反斜杠对代码行进行换行。
************************************
在 JavaScript 中，用分号来结束语句是可选的。
JavaScript 函数是将语句组合在块中的典型例子。
可以这样换行：
document.write("Hello \
World!");
但是不能：
document.write \
("Hello World!");
JavaScript 是脚本语言。浏览器会在读取代码时，逐行地执行脚本代码。而对于传统编程来说，会在执行前对所有代码进行编译。
************************************
JavaScript 注释
JavaScript 注释可用于提高代码的可读性。
单行注释以 // 开头。
多行注释以 /* 开始，以 */ 结尾。
使用注释来阻止执行（可用于调试）：//document.getElementById("myH1").innerHTML="Welcome to my Homepage";
************************************
************************************
JavaScript 变量
变量是存储信息的容器。可以把变量看做存储数据的容器。
变量必须以字母开头
变量也能以 $ 和 _ 符号开头（不过我们不推荐这么做）
变量名称对大小写敏感（y 和 Y 是不同的变量）
提示：JavaScript 语句和 JavaScript 变量都对大小写敏感。
JavaScript 数据类型
在 JavaScript 中，类似 "Bill Gates" 这样一条文本被称为字符串。
声明（创建） JavaScript 变量
我们使用 var 关键词来声明变量[变量声明之后，该变量是空的（它没有值）]：
var carname;
向变量赋值，使用等号：
carname="Volvo"; or var carname="Volvo";
创建了名为 carname 的变量，并向其赋值 "Volvo"，然后把它放入 id="demo" 的 HTML 段落中：
<p id="demo"></p>
var carname="Volvo";
document.getElementById("demo").innerHTML=carname;
一条语句，多个变量
var name="Gates", age=56, job="CEO";
Value = http://www.mamicode.com/undefined
未使用值来声明的变量，其值实际上是 undefined。在执行过 var carname; 后，变量 carname 的值将是 undefined。
重新声明 JavaScript 变量
如果重新声明 JavaScript 变量，该变量的值不会丢失：
var carname="Volvo";
var carname; //变量 carname 的值依然是 "Volvo"：
JavaScript 算数
您可以通过 JavaScript 变量来做算数，使用的是 = 和 + 这类运算符：
************************************
与代数一样，JavaScript 变量可用于存放值（比如 x=2）和表达式（比如 z=x+y）。
变量可以使用短名称（比如 x 和 y），也可以使用描述性更好的名称（比如 age, sum, totalvolume）。
JavaScript 变量有很多种类型，但是现在，我们只关注数字和字符串。
当您向变量赋的值是数值时，不要使用引号。如果您用引号包围数值，该值会被作为文本来处理。
************************************
JavaScript 数据类型
字符串、数字、布尔、数组、对象、Null、Undefined
JavaScript 拥有动态类型。这意味着相同的变量可用作不同的类型
JavaScript 字符串
字符串可以是引号中的任意文本。可以在字符串中使用引号，只要不匹配包围字符串的引号即可
JavaScript 数字
JavaScript 只有一种数字类型。数字可以带小数点，也可以不带，极大或极小的数字可以通过科学（指数）计数法来书写。
JavaScript 布尔
布尔（逻辑）只能有两个值：true 或 false。
JavaScript 数组
数组下标是基于零的，所以第一个项目是 [0]，第二个是 [1]，以此类推。
创建数组：
var cars=new Array();
cars[0]="Audi";
cars[1]="BMW";
cars[2]="Volvo";
或者(condensed array)：var cars=new Array("Audi","BMW","Volvo");
或者(literal array)：var cars=["Audi","BMW","Volvo"];
JavaScript 对象
对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔：
var person={firstname:"Bill", lastname:"Gates", id:5566};
[对象 (person) 有三个属性：firstname、lastname 以及 id。空格和折行无关紧要。]
对象属性有两种寻址方式：
name=person.lastname;
name=person["lastname"];
Undefined 和 Null
Undefined 这个值表示变量不含有值。可以通过将变量的值设置为 null 来清空变量。
声明变量类型
var carname=new String;
var x= new Number;
var y= new Boolean;
var cars= new Array;
var person= new Object;
当您声明新变量时，可以使用关键词 "new" 来声明其类型。JavaScript 变量均为对象。当您声明一个变量时，就创建了一个新的对象。
************************************
************************************
JavaScript 对象
JavaScript 中的所有事物都是对象：字符串、数字、数组、日期，等等。
在 JavaScript 中，对象是拥有属性和方法的数据。
JavaScript 中的对象
var txt = "Hello";
[您实际上已经创建了一个 JavaScript 字符串对象。字符串对象拥有内建的属性 length。对于上面的字符串来说，length 的值是 5。字符串对象同时拥有若干个内建的方法。]
创建 JavaScript 对象
JavaScript 中的几乎所有事务都是对象：字符串、数字、数组、日期、函数，等等。
访问对象的属性
访问对象属性的语法是：objectName.propertyName
访问对象的方法
您可以通过下面的语法调用方法：objectName.methodName()
************************************
属性是与对象相关的值。方法是能够在对象上执行的动作。属性和方法常被称为对象的成员。
创建新 JavaScript 对象有很多不同的方法，并且您还可以向已存在的对象添加属性和方法。
在面向对象的语言中，使用 camel-case 标记法的函数是很常见的。您会经常看到 someMethod() 这样的函数名，而不是 some_method()。
************************************
JavaScript基础的知识总结——[1]