1、

var x=document.getElementById("demo").value;

if(x==""||isNaN(x))

{

alert("不是数字");

}

请使用 "id" 属性来标识 HTML 元素

2、

<script>

document.write("<h1>这是一个标题</h1>");

</script>

如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖

3、

function myFunction() { document.getElementById("demo").innerHTML="我的第一个 JavaScript 函数"; }

4、

<script src="myScript.js"></script>

5、

如果您把值赋给尚未声明的变量，该变量将被自动作为全局变量声明。

这条语句：

carname="Volvo";

将声明一个全局变量 carname，即使它在函数内执行。

函数内未声明即使用的变量情况：

function func(){ undefined_var=110 }

在 func() 被第一次调用之前， undefined_var 变量是不存在的即 undefined。func() 被调用过之后，undefined_var 成为全局变量。

6、

在 HTML 中, 全局变量是 window 对象: 所有数据变量都属于 window 对象。

 

//此处可使用 window.carName function myFunction() { carName = "Volvo"; }

7、

 

8、

<button οnclick="this.innerHTML=Date()">现在的时间是?</button>

使用 innerHTML 写入到 HTML 元素

console.log() 写入到浏览器的控制台。

9、

=== 为绝对相等，即数据类型与值都必须相等。

10、

 在JavaScript中，数组是一种特殊的对象类型。用 typeof 检测 null 返回是object。

11、

JavaScript 数据类型

在 JavaScript 中有 5 种不同的数据类型：

• string
• number
• boolean
• object
• function

3 种对象类型：

• Object
• Date
• Array

2 个不包含任何值的数据类型：

• null
• undefined

请注意：

• NaN 的数据类型是 number
• 数组(Array)的数据类型是 object
• 日期(Date)的数据类型为 object
• null 的数据类型是 object
• 未定义变量的数据类型为 undefined

如果对象是 JavaScript Array 或 JavaScript Date ，我们就无法通过 typeof 来判断他们的类型，因为都是 返回 Object。

12、

"<br>"

13.

constructor 属性返回所有 JavaScript 变量的构造函数。

14.

全局方法 String() 可以将数字转换为字符串。

Number 方法 toString() 也是有同样的效果。

15.

Number("3.14")    // 返回 3.14

Number(" ")       // 返回 0 

Number("")        // 返回 0

Number("99 88")   // 返回 NaN

16.

Operator + 可用于将变量转换为数字：

实例

var y = "5";      // y 是一个字符串

var x = + y;      // x 是一个数字5

17.

自动转换类型

当 JavaScript 尝试操作一个 "错误" 的数据类型时，会自动转换为 "正确" 的数据类型。

以下输出结果不是你所期望的：

5 + null    // 返回 5         null 转换为 0

"5" + null  // 返回"5null"   null 转换为 "null"

"5" + 1     // 返回 "51"      1 转换为 "1"  

"5" - 1     // 返回 4         "5" 转换为 5

18.

JavaScript 语句 try 和 catch 是成对出现的。

语法

try { //在这里运行代码 } catch(err) { //在这里处理错误 }

19.

变量提升：函数声明和变量声明总是会被解释器悄悄地被"提升"到方法体的最顶部。

JavaScript 只有声明的变量会提升，初始化的不会。使用表达式定义函数时无法提升。

20.

使用箭头函数定义函数时可以省略 function 关键字 const Test = (...params) => { // } // 该函数只有一个参数时可以简写成： const Test = param => { return param; }

21.

let inputs = document.getElementsByName('checkbox') for(var i =0;i<inputs.length;i++){inputs[i].checked = checkAll}

 

在 ES6 中，提供了 let 关键字和 const 关键字。

let 的声明方式与 var 相同，用 let 来代替 var 来声明变量，就可以把变量限制在当前代码块中。

使用 const 声明的是常量，其值一旦被设定便不可被更改。

function letTest() { let x = 1; if (true) { let x = 2; // 不同的变量 console.log(x); // 2 } console.log(x); // 1 }

22.

我们可以使用 typeof 来获取一个变量是否存在，如 if(typeof a!="undefined"){}，而不要去使用 if(a) 因为如果 a 不存在（未声明）则会出错。

因为 typeof 遇到 null,数组,对象时都会返回 object 类型，所以使用另一个关键语法 instanceof

var result = objectName instanceof objectType

返回布尔值，如果是指定类型返回 true，否则返回 false

23.

以下是 HTML 事件的实例：

• HTML 页面完成加载
• HTML input 字段改变时
• HTML 按钮被点击

常见的HTML事件

下面是一些常见的HTML事件的列表:

事件	描述
onchange	HTML 元素改变
onclick	用户点击 HTML 元素
onmouseover	用户在一个HTML元素上移动鼠标
onmouseout	用户从一个HTML元素上移开鼠标
onkeydown	用户按下键盘按键
onload	浏览器已完成页面的加载

更多事件列表: 。

24.

你也可以在字符串添加转义字符来使用引号：

实例

var x = 'It\'s alright';

var y = "He is called \"Johnny\"";

25.

JavaScript == 与 === 区别

1、对于 string、number 等基础类型，== 和 === 是有区别的

• a）不同类型间比较，== 之比较 "转化成同一类型后的值" 看 "值" 是否相等，=== 如果类型不同，其结果就是不等。
•  b）同类型比较，直接进行 "值" 比较，两者结果一样。

2、对于 Array,Object 等高级类型，== 和 === 是没有区别的

进行 "指针地址" 比较

3、基础类型与高级类型，== 和 === 是有区别的

• a）对于 ==，将高级转化为基础类型，进行 "值" 比较
•  b）因为类型不同，=== 结果为 false

4、!= 为 == 的非运算，!== 为 === 的非运算

var num=1； var str="1"； var test=1； test == num //true　相同类型　相同值 test === num //true　相同类型　相同值 test !== num //false test与num类型相同，其值也相同,　非运算肯定是false num == str //true 　把str转换为数字，检查其是否相等。 num != str //false == 的 非运算 num === str //false 类型不同，直接返回false num !== str //true num 与 str类型不同 意味着其两者不等　非运算自然是true啦

26.

var r=Math.random();

 

var d=new Date().getDay();

switch (d){

case 0:x="今天是星期日";

break;

case 1:x="今天是星期一";

break;

case 2:x="今天是星期二";

break;

case 3:x="今天是星期三";

break;

case 4:x="今天是星期四";

break;

case 5:x="今天是星期五";

break;

case 6:x="今天是星期六";

break;

26、

严格模式："use strict" 指令只允许出现在脚本或函数的开头。

<script>

"use strict";

x = 3.14; // 报错 (x 未定义)

</script>

27、

var x = 0.1;

var y = 0.2;

var z = x + y            // z 的结果为 0.30000000000000004

if (z == 0.3)            // 返回 false

 

为解决以上问题，可以用整数的乘除法来解决：

var z = (x * 10 + y * 10) / 10;       // z 的结果为 0.3

28、

在 JavaScript 中，分号是可选的 。

29、

JavaScript 不支持使用名字来索引数组，只允许使用数字索引。

30、

如果我们想测试对象是否存在，在对象还没定义时将会抛出一个错误。

正确的方式：if (typeof myObj !== "undefined" && myObj !== null)

31、

程序块作用域

在每个代码块中 JavaScript 不会创建一个新的作用域，一般各个代码块的作用域都是全局的。

以下代码的的变量 i 返回 10，而不是 undefined：

实例

for (var i = 0; i < 10; i++) {

    // some code

}

return i;

32、

JavaScript 表单

var x = document.forms["myForm"]["fname"].value;

用于判断表单字段(fname)值是否存在

 

关于多表单使用同一验证函数问题：

function validateForm(form) { var x = form.name.value; if (x == null || x == "") { alert("输入不能为空！"); return false; } }

所有表单调用时都使用：

οnsubmit="return validateForm(this)"

33、

if (inpObj.validity.rangeUnderflow) { txt = "输入的值太小了"; }

 

setCustomValidity 的用法：

var inpObj = document.getElementById("id1"); inpObj.setCustomValidity(''); // 取消自定义提示的方式

//checkValidity() 如果 input 元素中的数据是合法的返回 true，否则返回 false。 if (inpObj.checkValidity() == false) {     if(inpObj.value==""){         inpObj.setCustomValidity("不能为空！");     }else if(inpObj.value<100 || inpObj.value>300){         inpObj.setCustomValidity("请重新输入数值（100~300之间）!");     } document.getElementById("demo").innerHTML = inpObj.validationMessage; } else { document.getElementById("demo").innerHTML = "输入正确"; }

34、

Javascrip中每个函数都会有一个Arguments对象实例arguments，它引用着函数的实参，可以用数组下标的方式"[]"引用arguments的元素。

 

with 语句可以方便地用来引用某个特定对象中已有的属性

var people=new Lakers();  

with(people)  

{  

       var str = "姓名: " + name + "<br>";  

       str += "年龄：" + age + "<br>";  

       str += "性别：" + gender;  

       document.write(str);  

}  

35、

JSON 语法规则

• 数据为 键/值 对。
• 数据由逗号分隔。
• 大括号保存对象
• 方括号保存数组

JSON 字符串转换为 JavaScript 对象

首先，创建 JavaScript 字符串，字符串为 JSON 格式的数据：

var text = '{ "sites" : [' + '{ "name":"Runoob" , "url":"www.runoob.com" },' + '{ "name":"Google" , "url":"www.google.com" },' + '{ "name":"Taobao" , "url":"www.taobao.com" } ]}';

然后，使用 JavaScript 内置函数 JSON.parse() 将字符串转换为 JavaScript 对象:

var obj = JSON.parse(text);

36、

void func() javascript:void func() 或者 void(func()) javascript:void(func())

37、

JavaScript 使用关键字 function 定义函数。

 

function functionName(parameters) { 执行的代码 }

 

var x = function (a, b) {return a * b};//匿名函数 (函数没有名称)。

var z = x(4, 3);

 

var myFunction = new Function("a", "b", "return a * b");//Function() 构造函数

var x = myFunction(4, 3);

38、

函数表达式可以 "自调用"。

自调用表达式会自动调用。

如果表达式后面紧跟 () ，则会自动调用。

不能自调用声明的函数。

(function () {

document.getElementById("demo").innerHTML = "Hello! 我是自己调用的";

})();

39、

函数是对象

在 JavaScript 中使用 typeof 操作符判断函数类型将返回 "function" 。

但是JavaScript 函数描述为一个对象更加准确。

JavaScript 函数有 属性 和 方法。

arguments.length 属性返回函数调用过程接收到的参数个数：

实例

function myFunction(a, b) {

    return arguments.length;

}

40、

function myFunction(x, y) { if (y === undefined) { y = 0; } }

或者，更简单的方式：

实例

function myFunction(x, y) { y = y || 0; }

如果y已经定义 ， y || 返回 y, 因为 y 是 true, 否则返回 0, 因为 undefined 为 false。

 

通过值传递参数

在函数中调用的参数是函数的隐式参数。

JavaScript 隐式参数通过值来传递：函数仅仅只是获取值。

如果函数修改参数的值，不会修改显式参数的初始值（在函数外定义）。

隐式参数的改变在函数外是不可见的。

通过对象传递参数

在JavaScript中，可以引用对象的值。

因此我们在函数内部修改对象的属性就会修改其初始的值。

修改对象属性可作用于函数外部（全局变量）。

修改对象属性在函数外是可见的。

41、

this 关键字

一般而言，在Javascript中，this指向函数执行时的当前对象。

注意 this 是保留关键字，你不能修改 this 的值。

 

函数作为对象方法调用，会使得 this 的值成为对象本身。

 

构造函数中 this 关键字没有任何的值。this 的值在函数调用实例化对象(new object)时创建。

 

在 JavaScript 中, 函数是对象。JavaScript 函数有它的属性和方法。

call() 和 apply() 是预定义的函数方法。 两个方法可用于调用函数，两个方法的第一个参数必须是对象本身。

实例

function myFunction(a, b) { return a * b; } myObject = myFunction.call(myObject, 10, 2); // 返回 20

实例

function myFunction(a, b) { return a * b; } myArray = [10, 2]; myObject = myFunction.apply(myObject, myArray); // 返回 20

两者的区别在于第二个参数： apply传入的是一个参数数组，也就是将多个参数组合成为一个数组传入，而call则作为call的参数传入（从第二个参数开始）。

在 JavaScript 严格模式(strict mode)下, 在调用函数时第一个参数会成为 this 的值， 即使该参数不是一个对象。

在 JavaScript 非严格模式(non-strict mode)下, 如果第一个参数的值是 null 或 undefined, 它将使用全局对象替代。

 

this只能在函数内部使用，this指的是，调用函数的那个对象。

42、

JavaScript 闭包

var add = (function () { var counter = 0; return function () {return counter += 1;} })(); add(); add(); add(); // 计数器为 3

43、

查找 HTML 元素

通过 id 找到 HTML 元素

通过标签名找到 HTML 元素

通过类名class找到 HTML 元素

 

在 JavaScript 中，document.write() 可用于直接向 HTML 输出流写内容。绝对不要在文档加载完成之后使用 document.write()。这会覆盖该文档。

 

如需改变 HTML 元素的内容，请使用这个语法：

document.getElementById("id").innerHTML="新文本";

 

如需改变 HTML 元素的属性，请使用这个语法：

document.getElementById(id).attribute=新属性值

 

如需改变 HTML 元素的样式，请使用这个语法：

document.getElementById(id).style.property=新样式

44、

onload 和 onunload 事件会在用户进入或离开页面时被触发。

onchange 事件当用户改变输入字段的内容时会调用。

onmouseover 和 onmouseout 事件可用于在用户的鼠标移至 HTML 元素上方或移出元素时触发函数。

onmousedown, onmouseup 以及 onclick 构成了鼠标点击事件的所有部分。首先当点击鼠标按钮时，会触发 onmousedown 事件，当释放鼠标按钮时，会触发 onmouseup 事件，最后，当完成鼠标点击时，会触发onclick 事件。

当获得焦点时

resize当用户重置窗口大小时

45、

addEventListener() 方法用于向指定元素添加事件句柄。

addEventListener() 方法添加的事件句柄不会覆盖已存在的事件句柄。

你可以向一个元素添加多个事件句柄。

你可以向同个元素添加多个同类型的事件句柄，如：两个 "click" 事件。

你可以向任何 DOM 对象添加事件监听，不仅仅是 HTML 元素。如： window 对象。

addEventListener() 方法可以更简单的控制事件（冒泡与捕获）。

当你使用 addEventListener() 方法时, JavaScript 从 HTML 标记中分离开来，可读性更强， 在没有控制HTML标记时也可以添加事件监听。

你可以使用 removeEventListener() 方法来移除事件的监听。

注意： IE 8 及更早 IE 版本，Opera 7.0及其更早版本不支持 addEventListener() 和 removeEventListener() 方法。但是，对于这类浏览器版本可以使用 detachEvent() 方法来移除事件句柄:

element.attachEvent(event, function);

element.detachEvent(event, function);

所有浏览器兼容的解决方法：

if (x.addEventListener) {

x.addEventListener("click", myFunction);

} else if (x.attachEvent) {

x.attachEvent("onclick", myFunction);

}

语法

element.addEventListener(event, function, useCapture);

第一个参数是事件的类型 (如 "click" 或 "mousedown").

第二个参数是事件触发后调用的函数。

第三个参数是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。

在 冒泡 中，内部元素的事件会先被触发，然后再触发外部元素；在 捕获 中，外部元素的事件会先被触发，然后才会触发内部元素的事件；默认值为 false, 即冒泡传递，当值为 true 时, 事件使用捕获传递。

注意:不要使用 "on" 前缀。 例如，使用 "click" ,而不是使用 "onclick"。

element.addEventListener("click", function(){ alert("Hello World!"); });

document.getElementById("demo").innerHTML += "Moused over!<br>"

46、

如需向 HTML DOM 添加新元素，您必须首先创建该元素（元素节点），然后向一个已存在的元素追加该元素。

<script>

var para=document.createElement("p");

var node=document.createTextNode("这是一个新段落。");

para.appendChild(node);

 

var element=document.getElementById("div1");

element.appendChild(para);

</script>

删除已有的 HTML 元素

<div id="div1">

<p id="p1">这是一个段落。</p>

<p id="p2">这是另一个段落。</p>

</div>

<script>

var parent=document.getElementById("div1");

var child=document.getElementById("p1");

parent.removeChild(child);

</script>

常用的解决方案：找到您希望删除的子元素，然后使用其 parentNode 属性来找到父元素：

var child=document.getElementById("p1");

child.parentNode.removeChild(child);

47、

使用对象构造器（使用函数来构造对象）

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

var myFather=new person("John","Doe",50,"blue");

 

function person(firstname,lastname,age,eyecolor) {     this.firstname=firstname;     this.lastname=lastname;     this.age=age;     this.eyecolor=eyecolor;     this.changeName=changeName;     function changeName(name)     {         this.lastname=name;     } }

48、

JavaScript 是面向对象的语言，但 JavaScript 不使用类。

JavaScript 基于 prototype，而不是基于类的。

49、

在JavaScript中，数字不分为整数类型和浮点型类型，所有的数字都是浮点型类型。

精度

整数（不使用小数点或指数计数法）最多为 15 位。

如果前缀为 0，则 JavaScript 会把数值常量解释为八进制数，如果前缀为 0 和 "x"，则解释为十六进制数。

默认情况下，JavaScript 数字为十进制显示。但是你可以使用 toString() 方法 输出16进制、8进制、2进制。

实例

var myNumber=128;

myNumber.toString(16);   // 返回 80

myNumber.toString(8);    // 返回 200

myNumber.toString(2);    // 返回 10000000

50、

var carname="Volvo XC60";

使用位置（索引）可以访问字符串中任何的字符：

var character=carname[7];

 

字符串使用 indexOf() 来定位字符串中某一个指定的字符首次出现的位置：

实例

var str="Hello world, welcome to the universe.";

var n=str.indexOf("welcome");

如果没找到对应的字符函数返回-1

lastIndexOf() 方法在字符串末尾开始查找字符串出现的位置。

 

内容匹配

match()函数用来查找字符串中特定的字符，并且如果找到的话，则返回这个字符。

var str="Hello world!";

document.write(str.match("world") + "<br>");//返回world

 

replace() 方法在字符串中用某些字符替换另一些字符。

实例

str="Please visit Microsoft!"

var n=str.replace("Microsoft","Runoob");

 

字符串大小写转换使用函数 toUpperCase() / toLowerCase():

实例

var txt="Hello World!";       // String

var txt1=txt.toUpperCase();   // txt1 文本会转换为大写

var txt2=txt.toLowerCase();   // txt2 文本会转换为小写

 

字符串使用split()函数转为数组:

实例

txt="a,b,c,d,e"   // String

txt.split(",");   // 使用逗号分隔

51、

有四种方式初始化日期:

new Date() // 当前日期和时间

new Date(milliseconds) //返回从 1970 年 1 月 1 日至今的毫秒数

new Date(dateString)

new Date(year, month, day, hours, minutes, seconds, milliseconds)

上面的参数大多数都是可选的，在不指定的情况下，默认参数是0。

52、

创建一个数组

1: 常规方式:

var myCars=new Array(); 

myCars[0]="Saab";       

myCars[1]="Volvo";

myCars[2]="BMW";

2: 简洁方式:

var myCars=new Array("Saab","Volvo","BMW");

3: 字面:

var myCars=["Saab","Volvo","BMW"];

 

你可以在一个数组中包含对象元素、函数、数组：

myArray[0]=Date.now;

myArray[1]=myFunction;

myArray[2]=myCars;

53、

test()方法搜索字符串指定的值，根据结果并返回真或假。

var patt1=new RegExp("e"); document.write(patt1.test("The best things in life are free"));

由于该字符串中存在字母 "e"，以上代码的输出将是：true

 

exec() 方法检索字符串中的指定值。返回值是被找到的值。如果没有发现匹配，则返回 null。

var patt1=new RegExp("e"); document.write(patt1.exec("The best things in life are free"));

由于该字符串中存在字母 "e"，以上代码的输出将是：e

54、

Window 尺寸

var w=window.innerWidth

|| document.documentElement.clientWidth

|| document.body.clientWidth;

 

var h=window.innerHeight

|| document.documentElement.clientHeight

|| document.body.clientHeight;

 

location.assign() 方法加载新的文档。

window.location.assign("http://www.w3cschool.cc")

 

history.back() - 与在浏览器点击后退按钮相同

history.forward() - 与在浏览器中点击向前按钮相同

 

 

alert("你好，我是一个警告框！");

 

var r=confirm("按下按钮");

if (r==true)

{

    x="你按下了\"确定\"按钮!";

}

else

{

    x="你按下了\"取消\"按钮!";

}

 

window.prompt("sometext","defaultvalue");

提示框经常用于提示用户在进入页面前输入某个值。

 

 

setInterval() 间隔指定的毫秒数不停地执行指定的代码

window.setInterval("javascript function",milliseconds);

实例

var myVar=setInterval(function(){myTimer()},1000); function myTimer() { var d=new Date(); var t=d.toLocaleTimeString(); document.getElementById("demo").innerHTML=t; }

clearInterval() 方法用于停止 setInterval() 方法执行的函数代码。

clearInterval(myVar);

 

myVar= window.setTimeout("javascript function", milliseconds);

setTimeout() 的第一个参数是含有 JavaScript 语句的字符串。第二个参数指示从当前起多少毫秒后执行第一个参数。

实例

等待3秒，然后弹出 "Hello":

setTimeout(function(){alert("Hello")},3000);

如果函数还未被执行，clearTimeout(myVar) 方法用于停止执行setTimeout()方法的函数代码。

 

JavaScript 中，创建 cookie 如下所示：

document.cookie="username=John Doe";

您还可以为 cookie 添加一个过期时间（以 UTC 或 GMT 时间）。默认情况下，cookie 在浏览器关闭时删除：

document.cookie="username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 GMT";

您可以使用 path 参数告诉浏览器 cookie 的路径。默认情况下，cookie 属于当前页面。

document.cookie="username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 GMT; path=/";

 

在 JavaScript 中, 可以使用以下代码来读取 cookie：

var x = document.cookie;

document.cookie 将以字符串的方式返回所有的 cookie，类型格式： cookie1=value; cookie2=value; cookie3=value;

 

在 JavaScript 中，修改 cookie 类似于创建 cookie，旧的 cookie 将被覆盖。

删除 cookie 非常简单。您只需要设置 expires 参数为以前的时间即可，如

document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";

注意，当您删除时不必指定 cookie 的值。

如果您设置了新的 cookie，旧的 cookie 不会被覆盖。//名不同