w3cschool之JavaScript学习

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

心之所善兮

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

阅读量1.9k

点赞数 1

分类专栏： w3cschool学习

本文链接：https://blog.csdn.net/baidu_26994091/article/details/52482521

版权

w3cschool学习专栏收录该内容

1 篇文章 0 订阅

订阅专栏

1.JS的实现

JS脚本必须位于 <script> 与 </script> 标签之间

script标签可以放在HTML文件的head或者body标签中。

一般我喜欢统一放在head中。

a.放在head中，例如

 
  <html> 
 
  <head> 
 
      <script> 
 
          function myFunction(){ 
 
              document.getElementById("demo").innerHTML="My First JavaScript Function"; 
 
          } 
 
      </script> 
 
  </head> 
 
  <body> 
 
      <h1> 
 
      My Web Page 
 
      </h1> 
 
      <p id="demo"> 
 
      A Paragraph 
 
      </p> 
 
      <button type="button" οnclick="myFunction()"> 
 
      点击这里 
 
      </button> 
 
  </body> 
 
  </html>

b.放在body中，例如：

 
  <html> 
 
  <body> 
 
      <h1> 
 
      My Web Page 
 
      </h1> 
 
      <p id="demo"> 
 
      A Paragraph 
 
      </p> 
 
      <button type="button" οnclick="myFunction()"> 
 
      点击这里 
 
      </button> 
 
  <!- 脚本放在body的最后面-> 
 
      <script> 
 
          function myFunction(){ 
 
              document.getElementById("demo").innerHTML="My First JavaScript Function"; 
 
          } 
 
      </script> 
 
  </body> 
 
  </html>

c.通过引入外部JS文件的方式调用，例如：

外部文件a-2.js

 
  function myFunction(){ 
 
      document.getElementById("demo").innerHTML="My First JavaScript Function"; 
 
  }

在这里引入外部JS文件 :

 
  <html> 
 
  <head>    
 
  <script src="a-2.js"></script> 
 
  </head> 
 
  <body> 
 
      <h1> 
 
      My Web Page 
 
      </h1> 
 
      <p id="demo"> 
 
      A Paragraph 
 
      </p> 
 
      <button type="button" οnclick="myFunction()"> 
 
      点击这里 
 
      </button> 
 
  </body> 
 
  </html>

注意：无论是外部引入还是直接嵌入在html中，每一个script标签对里面的代码彼此之间都是公共可访问的，所以可以把多个script标签对合成到一个script标签对中了。外部脚本不能包含 <script> 标签。

2.JS的输出

a. 操作HTML元素:

使用id属性标记html元素，然后使用id来访问该元素

例如：

 
  <html> 
 
      <head> 
 
          <script> 
 
              window.οnlοad=function(){ 
 
                  document.getElementById("demo").innerHTML="My First JavaScript"; 
 
              } 
 
          </script> 
 
      </head> 
 
      <body> 
 
          <h1> 
 
              My First Web Page 
 
          </h1> 
 
          <p id="demo"> 
 
              My First Paragraph. 
 
          </p> 
 
      </body> 
 
  <html>

b .写信息到html文档中

 
  <html> 
 
      <head> 
 
          <script> 
 
              window.οnlοad= function(){ 
 
                  document.write("<p>My First JavaScript</p>"); 
 
              } 
 
          </script> 
 
      </head> 
 
      <body> 
 
          <h1>My First Web Page</h1> 
 
      </body> 
 
  </html>

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

3.注释

js代码中的注释使用：

//这是单行注释

或者

/**

这是多行注释

html中的注释使用：

<!- html中的注释>

4.JS中的变量

因为JS是弱数据类型型语言，声明变量使用var关键字即可。

 
 var carname="Volvo";
  

 
 var name="Gates", age=56, job="CEO"; 

注意：如果一个变量只是声明了，但是没有赋值，那么该变量的值为undefined;变量可以重复声明，如果重新声明时没有再赋值，那么不会改变它的值。

如果我们对一个未使用关键字var声明的变量赋值，那么该变量就成为了全局变量。

5.JS中的数据类型

数值类型，

 
  var x = 6; 
 

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

var y=0377; 
  var z=0xFF; 
 

一些常见你的属性常量和方法，

属性：

MAX VALUE
MIN VALUE
NEGATIVE INFINITIVE
POSITIVE INFINITIVE
NaN
prototype
constructor

方法：

toExponential()
toFixed()
toPrecision()
toString()
valueOf()

字符串类型，

var carname="Bill Gates";
var carname='Bill Gates';

String 对象属性

属性	描述
constructor	对创建该对象的函数的引用
length	字符串的长度
prototype	允许您向对象添加属性和方法

String 对象方法

方法	描述
anchor()	创建 HTML 锚。
big()	用大号字体显示字符串。
blink()	显示闪动字符串。
bold()	使用粗体显示字符串。
charAt()	返回在指定位置的字符。
charCodeAt()	返回在指定的位置的字符的 Unicode 编码。
concat()	连接字符串。
fixed()	以打字机文本显示字符串。
fontcolor()	使用指定的颜色来显示字符串。
fontsize()	使用指定的尺寸来显示字符串。
fromCharCode()	从字符编码创建一个字符串。
indexOf()	检索字符串。
italics()	使用斜体显示字符串。
lastIndexOf()	从后向前搜索字符串。
link()	将字符串显示为链接。
localeCompare()	用本地特定的顺序来比较两个字符串。
match()	找到一个或多个正则表达式的匹配。
replace()	替换与正则表达式匹配的子串。
search()	检索与正则表达式相匹配的值。
slice()	提取字符串的片断，并在新的字符串中返回被提取的部分。
small()	使用小字号来显示字符串。
split()	把字符串分割为字符串数组。
strike()	使用删除线来显示字符串。
sub()	把字符串显示为下标。
substr()	从起始索引号提取字符串中指定数目的字符。
substring()	提取字符串中两个指定的索引号之间的字符。
sup()	把字符串显示为上标。
toLocaleLowerCase()	把字符串转换为小写。
toLocaleUpperCase()	把字符串转换为大写。
toLowerCase()	把字符串转换为小写。
toUpperCase()	把字符串转换为大写。
toSource()	代表对象的源代码。
toString()	返回字符串。
valueOf()	返回某个字符串对象的原始值。

布尔类型，

 
 var x=true
 var y=false

数组类型，

 
 new Array();
 new Array(size);
 new Array(element0, element1, ..., elementn);
  

 
 var cars=new Array();
 cars[0]="Audi";
 cars[1]="BMW";
 cars[2]="Volvo";
  

 
 var cars=new Array("Audi","BMW","Volvo");
  

Array 对象属性

属性	描述
constructor	返回对创建此对象的数组函数的引用。
length	设置或返回数组中元素的数目。
prototype	使您有能力向对象添加属性和方法。

Array 对象方法

方法	描述
concat()	连接两个或更多的数组，并返回结果。
join()	把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。
pop()	删除并返回数组的最后一个元素
push()	向数组的末尾添加一个或更多元素，并返回新的长度。
reverse()	颠倒数组中元素的顺序。
shift()	删除并返回数组的第一个元素
slice()	从某个已有的数组返回选定的元素
sort()	对数组的元素进行排序
splice()	删除元素，并向数组添加新元素。
toSource()	返回该对象的源代码。
toString()	把数组转换为字符串，并返回结果。
toLocaleString()	把数组转换为本地数组，并返回结果。
unshift()	向数组的开头添加一个或更多元素，并返回新的长度。
valueOf()	返回数组对象的原始值

对象类型，

var myMother=new person("Steve","Jobs",56,"green");

myMother.changeName("Ballmer");

 
 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;
 }
 }
  

日期对象，

创建 Date 对象的语法：

var myDate=new Date()

注释：Date 对象会自动把当前日期和时间保存为其初始值。

Date 对象属性

属性	描述
constructor	返回对创建此对象的 Date 函数的引用。
prototype	使您有能力向对象添加属性和方法。

Date 对象方法

方法	描述
Date()	返回当日的日期和时间。
getDate()	从 Date 对象返回一个月中的某一天 (1 ~ 31)。
getDay()	从 Date 对象返回一周中的某一天 (0 ~ 6)。
getMonth()	从 Date 对象返回月份 (0 ~ 11)。
getFullYear()	从 Date 对象以四位数字返回年份。
getYear()	请使用 getFullYear() 方法代替。
getHours()	返回 Date 对象的小时 (0 ~ 23)。
getMinutes()	返回 Date 对象的分钟 (0 ~ 59)。
getSeconds()	返回 Date 对象的秒数 (0 ~ 59)。
getMilliseconds()	返回 Date 对象的毫秒(0 ~ 999)。
getTime()	返回 1970 年 1 月 1 日至今的毫秒数。
getTimezoneOffset()	返回本地时间与格林威治标准时间 (GMT) 的分钟差。
getUTCDate()	根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。
getUTCDay()	根据世界时从 Date 对象返回周中的一天 (0 ~ 6)。
getUTCMonth()	根据世界时从 Date 对象返回月份 (0 ~ 11)。
getUTCFullYear()	根据世界时从 Date 对象返回四位数的年份。
getUTCHours()	根据世界时返回 Date 对象的小时 (0 ~ 23)。
getUTCMinutes()	根据世界时返回 Date 对象的分钟 (0 ~ 59)。
getUTCSeconds()	根据世界时返回 Date 对象的秒钟 (0 ~ 59)。
getUTCMilliseconds()	根据世界时返回 Date 对象的毫秒(0 ~ 999)。
parse()	返回1970年1月1日午夜到指定日期（字符串）的毫秒数。
setDate()	设置 Date 对象中月的某一天 (1 ~ 31)。
setMonth()	设置 Date 对象中月份 (0 ~ 11)。
setFullYear()	设置 Date 对象中的年份（四位数字）。
setYear()	请使用 setFullYear() 方法代替。
setHours()	设置 Date 对象中的小时 (0 ~ 23)。
setMinutes()	设置 Date 对象中的分钟 (0 ~ 59)。
setSeconds()	设置 Date 对象中的秒钟 (0 ~ 59)。
setMilliseconds()	设置 Date 对象中的毫秒 (0 ~ 999)。
setTime()	以毫秒设置 Date 对象。
setUTCDate()	根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。
setUTCMonth()	根据世界时设置 Date 对象中的月份 (0 ~ 11)。
setUTCFullYear()	根据世界时设置 Date 对象中的年份（四位数字）。
setUTCHours()	根据世界时设置 Date 对象中的小时 (0 ~ 23)。
setUTCMinutes()	根据世界时设置 Date 对象中的分钟 (0 ~ 59)。
setUTCSeconds()	根据世界时设置 Date 对象中的秒钟 (0 ~ 59)。
setUTCMilliseconds()	根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。
toSource()	返回该对象的源代码。
toString()	把 Date 对象转换为字符串。
toTimeString()	把 Date 对象的时间部分转换为字符串。
toDateString()	把 Date 对象的日期部分转换为字符串。
toGMTString()	请使用 toUTCString() 方法代替。
toUTCString()	根据世界时，把 Date 对象转换为字符串。
toLocaleString()	根据本地时间格式，把 Date 对象转换为字符串。
toLocaleTimeString()	根据本地时间格式，把 Date 对象的时间部分转换为字符串。
toLocaleDateString()	根据本地时间格式，把 Date 对象的日期部分转换为字符串。
UTC()	根据世界时返回 1970 年 1 月 1 日到指定日期的毫秒数。
valueOf()	返回 Date 对象的原始值。

Math对象

不需要创建，全部是静态函数了。

Math 对象属性

属性	描述
E	返回算术常量 e，即自然对数的底数（约等于2.718）。
LN2	返回 2 的自然对数（约等于0.693）。
LN10	返回 10 的自然对数（约等于2.302）。
LOG2E	返回以 2 为底的 e 的对数（约等于 1.414）。
LOG10E	返回以 10 为底的 e 的对数（约等于0.434）。
PI	返回圆周率（约等于3.14159）。
SQRT1_2	返回返回 2 的平方根的倒数（约等于 0.707）。
SQRT2	返回 2 的平方根（约等于 1.414）。

Math 对象方法

方法	描述
abs(x)	返回数的绝对值。
acos(x)	返回数的反余弦值。
asin(x)	返回数的反正弦值。
atan(x)	以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值。
atan2(y,x)	返回从 x 轴到点 (x,y) 的角度（介于 -PI/2 与 PI/2 弧度之间）。
ceil(x)	对数进行上舍入。
cos(x)	返回数的余弦。
exp(x)	返回 e 的指数。
floor(x)	对数进行下舍入。
log(x)	返回数的自然对数（底为e）。
max(x,y)	返回 x 和 y 中的最高值。
min(x,y)	返回 x 和 y 中的最低值。
pow(x,y)	返回 x 的 y 次幂。
random()	返回 0 ~ 1 之间的随机数。
round(x)	把数四舍五入为最接近的整数。
sin(x)	返回数的正弦。
sqrt(x)	返回数的平方根。
tan(x)	返回角的正切。
toSource()	返回该对象的源代码。
valueOf()	返回 Math 对象的原始值。

RegExp 正则表达式对象

创建 RegExp 对象的语法：

new RegExp(pattern, attributes);

参数

参数 pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式。

参数 attributes 是一个可选的字符串，包含属性 "g"、"i" 和 "m"，分别用于指定全局匹配、区分大小写的匹配和多行匹配。ECMAScript 标准化之前，不支持 m 属性。如果 pattern 是正则表达式，而不是字符串，则必须省略该参数。

返回值

一个新的 RegExp 对象，具有指定的模式和标志。如果参数 pattern 是正则表达式而不是字符串，那么 RegExp() 构造函数将用与指定的 RegExp 相同的模式和标志创建一个新的 RegExp 对象。

如果不用 new 运算符，而将 RegExp() 作为函数调用，那么它的行为与用 new 运算符调用时一样，只是当 pattern 是正则表达式时，它只返回 pattern，而不再创建一个新的 RegExp 对象。

抛出

SyntaxError - 如果 pattern 不是合法的正则表达式，或 attributes 含有 "g"、"i" 和 "m" 之外的字符，抛出该异常。

TypeError - 如果 pattern 是 RegExp 对象，但没有省略 attributes 参数，抛出该异常。

修饰符

修饰符	描述
i	执行对大小写不敏感的匹配。
g	执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）。
m	执行多行匹配。

方括号

方括号用于查找某个范围内的字符：

表达式	描述
[abc]	查找方括号之间的任何字符。
[^abc]	查找任何不在方括号之间的字符。
[0-9]	查找任何从 0 至 9 的数字。
[a-z]	查找任何从小写 a 到小写 z 的字符。
[A-Z]	查找任何从大写 A 到大写 Z 的字符。
[A-z]	查找任何从大写 A 到小写 z 的字符。
[adgk]	查找给定集合内的任何字符。
[^adgk]	查找给定集合外的任何字符。
(red\|blue\|green)	查找任何指定的选项。

元字符

元字符（Metacharacter）是拥有特殊含义的字符：

元字符	描述
.	查找单个字符，除了换行和行结束符。
\w	查找单词字符。
\W	查找非单词字符。
\d	查找数字。
\D	查找非数字字符。
\s	查找空白字符。
\S	查找非空白字符。
\b	匹配单词边界。
\B	匹配非单词边界。
\0	查找 NUL 字符。
\n	查找换行符。
\f	查找换页符。
\r	查找回车符。
\t	查找制表符。
\v	查找垂直制表符。
\xxx	查找以八进制数 xxx 规定的字符。
\xdd	查找以十六进制数 dd 规定的字符。
\uxxxx	查找以十六进制数 xxxx 规定的 Unicode 字符。

量词

量词	描述
n+	匹配任何包含至少一个 n 的字符串。
n*	匹配任何包含零个或多个 n 的字符串。
n?	匹配任何包含零个或一个 n 的字符串。
n{X}	匹配包含 X 个 n 的序列的字符串。
n{X,Y}	匹配包含 X 或 Y 个 n 的序列的字符串。
n{X,}	匹配包含至少 X 个 n 的序列的字符串。
n$	匹配任何结尾为 n 的字符串。
^n	匹配任何开头为 n 的字符串。
?=n	匹配任何其后紧接指定字符串 n 的字符串。
?!n	匹配任何其后没有紧接指定字符串 n 的字符串。

RegExp 对象属性

属性	描述	FF	IE
global	RegExp 对象是否具有标志 g。	1	4
ignoreCase	RegExp 对象是否具有标志 i。	1	4
lastIndex	一个整数，标示开始下一次匹配的字符位置。	1	4
multiline	RegExp 对象是否具有标志 m。	1	4
source	正则表达式的源文本。	1	4

RegExp 对象方法

方法	描述	FF	IE
compile	编译正则表达式。	1	4
exec	检索字符串中指定的值。返回找到的值，并确定其位置。	1	4
test	检索字符串中指定的值。返回 true 或 false。	1	4

支持正则表达式的 String 对象的方法

方法	描述	FF	IE
search	检索与正则表达式相匹配的值。	1	4
match	找到一个或多个正则表达式的匹配。	1	4
replace	替换与正则表达式匹配的子串。	1	4
split	把字符串分割为字符串数组。	1	4

null,

var car=null

undefined,

 
 var person; 

6.JS中的函数

使用关键字function,return可选，用于返回函数值或者结束函数，参数列表可选。

函数内部的变量声明和传进来的参数都是局部变量，执行完函数后会释放。

 
   function myFunction(var1,var2){ 
  
        这里是要执行的代码 
  
        [return 函数的返回值] 
  
   }

7.JS中的运算符

运算符	描述	例子	结果
+	加	x=y+2	x=7
-	减	x=y-2	x=3
*	乘	x=y*2	x=10
/	除	x=y/2	x=2.5
%	求余数 (保留整数)	x=y%2	x=1
++	累加	x=++y	x=6
--	递减	x=--y	x=4

运算符	描述	例子
==	等于	x==8 为 false
===	全等（值和类型）	x===5 为 true；x==="5" 为 false
!=	不等于	x!=8 为 true
>	大于	x>8 为 false
<	小于	x<8 为 true
>=	大于或等于	x>=8 为 false
<=	小于或等于	x<=8 为 true

运算符	描述	例子
&&	and	(x < 10 && y > 1) 为 true
\|\|	or	(x==5 \|\| y==5) 为 false
!	not	!(x==y) 为 true

 
 variablename=(condition)?value1:value2 
  

7.JS中选择语句，循环语句

选择语句：

 
 if (time<20)
   {
   x="Good day";
   }
 else
   {
   x="Good evening";
   }
  

switch(n)
 {
 case 1:
   执行代码块 1
   break;
 case 2:
   执行代码块 2
   break;
 default:
   n 与 case 1 和 case 2 不同时执行的代码 
  } 
 

循环语句：

 
 for (var i=0;i<cars.length;i++)
 {
 document.write(cars[i] + "<br>");
 }
  

 
  var person={fname:"John",lname:"Doe",age:25}; 
 
  //用于循环遍历对象属性 
 
for (x in person)
   {
   txt=txt + person[x];
   }

 
 while (i<5)
   {
   x=x + "The number is " + i + "<br>";
   i++;
   }
  

 
 do
   {
   x=x + "The number is " + i + "<br>";
   i++;
   }
 while (i<5);
  

跳出循环的关键字：

break;结束本层循环

continue;结束本次循环

8.JS中的异常错误

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

<!DOCTYPE html>
 <html>
 <head>
 <script>
 var txt="";
 function message()
 {
 try
   {
   adddlert("Welcome guest!"); 
    } 
 
 
  catch(err)  //将错误信息存放再err变量中 
 
  {
   txt="There was an error on this page.\n\n";
   txt+="Error description: " + err.message + "\n\n";
   txt+="Click OK to continue.\n\n";
   alert(txt);
   }
 }
 </script>
 </head>
 
 <body>
 <input type="button" value="View message" οnclick="message()">
 </body>
 
  
  </html> 
 

自己手动抛出异常使用关键字throw。例如

try
   {
   var x=document.getElementById("demo").value;
   if(x=="")     throw "empty";
   if(isNaN(x)) throw "not a number";
   if(x>10)     throw "too high";
   if(x<5)       throw "too low";
   }
 catch(err)
   {
   var y=document.getElementById("mess");
   y.innerHTML="Error: " + err + "."; 
    } 
 

9.HTML的DOM,文档对象模型

JavaScript 能够改变页面中的所有 HTML 元素
JavaScript 能够改变页面中的所有 HTML 属性
JavaScript 能够改变页面中的所有 CSS 样式
JavaScript 能够对页面中的所有事件做出反应

a.查找HTML元素

通过id属性：

 
 var x=document.getElementById("intro"); 

通过标签名：

 
 var y=x.getElementsByTagName("p"); 

注意：通过类名查找 HTML 元素在 IE 5,6,7,8 中无效。

b.操作HTML元素

通过上述查找元素的方法获取到元素后，我们就可以：

改变元素的属性，

 
 document.getElementById(id).innerHTML=new HTML 

 
 document.getElementById("image").src="landscape.jpg"; 

改变元素的样式，

 
 document.getElementById("p2").style.color="blue"; 

为元素添加事件，

onclick事件

 
  <h1 onclick="this.innerHTML='谢谢!'">请点击该文本</h1> 

onload 和 onunload 事件

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

onload 事件可用于检测访问者的浏览器类型和浏览器版本，并基于这些信息来加载网页的正确版本。

onload 和 onunload 事件可用于处理 cookie。

onchange事件

 
 <input type="text" id="fname" οnchange="upperCase()">
  

onmouseover 和 onmouseout 事件

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

onmousedown、onmouseup 以及 onclick 事件

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

onfocus事件

当输入字段获得焦点

c.添加和删除节点

添加，

 
 <div id="div1">
 <p id="p1">这是一个段落</p>
 <p id="p2">这是另一个段落</p>
 </div>
 
 <script>
 var para=document.createElement("p");
 var node=document.createTextNode("这是新段落。");
 para.appendChild(node);
 
 var element=document.getElementById("div1");
 element.appendChild(para);
 </script>
  

删除，

<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> 
 

 
  //在不清楚要删除的节点的父节点时 
 
  var child=document.getElementById("p1"); 
 
child.parentNode.removeChild(child);

10.window浏览器对象模型BOM

所有浏览器都支持 window 对象。它表示浏览器窗口。

所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。

全局变量是 window 对象的属性。

全局函数是 window 对象的方法。

甚至 HTML DOM 的 document 也是 window 对象的属性之一：

window的尺寸说明，

对于Internet Explorer、Chrome、Firefox、Opera 以及 Safari：

window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度

对于 Internet Explorer 8、7、6、5：

document.documentElement.clientHeight
document.documentElement.clientWidth

或者

document.body.clientHeight
document.body.clientWidth

兼容方法：

 
 var w=window.innerWidth
 || document.documentElement.clientWidth
 || document.body.clientWidth;
 
 var h=window.innerHeight
 || document.documentElement.clientHeight
 || document.body.clientHeight;
  

一些其他方法：

window.open() - 打开新窗口
window.close() - 关闭当前窗口
window.moveTo() - 移动当前窗口
window.resizeTo() - 调整当前窗口的尺寸

window的其它对象介绍：

window.screen 对象包含有关用户屏幕的信息。

screen.availWidth - 可用的屏幕宽度
screen.availHeight - 可用的屏幕高度

window.location 对象用于获得当前页面的地址 (URL)，并把浏览器重定向到新的页面

location.hostname 返回 web 主机的域名
location.pathname 返回当前页面的路径和文件名
location.port 返回 web 主机的端口（80 或 443）
location.protocol 返回所使用的 web 协议（http:// 或 https://）
location.href 属性返回当前页面的 URL。
location.assign() 方法加载新的文档。

window.history 对象包含浏览器的历史。

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

window.navigator 对象包含有关访问者浏览器的信息。

 
 <div id="example"></div>
 
 <script>
 
 txt = "<p>Browser CodeName: " + navigator.appCodeName + "</p>";
 txt+= "<p>Browser Name: " + navigator.appName + "</p>";
 txt+= "<p>Browser Version: " + navigator.appVersion + "</p>";
 txt+= "<p>Cookies Enabled: " + navigator.cookieEnabled + "</p>";
 txt+= "<p>Platform: " + navigator.platform + "</p>";
 txt+= "<p>User-agent header: " + navigator.userAgent + "</p>";
 txt+= "<p>User-agent language: " + navigator.systemLanguage + "</p>";
 
 document.getElementById("example").innerHTML=txt;
 
 </script>
  

window的消息框

警告框：

alert("我是警告框！！");

确认框:

 
  var r=confirm("Press a button!"); 
 
  if (r==true) 
 
    { 
 
    alert("You pressed OK!"); 
 
    } 
 
  else 
 
    { 
 
    alert("You pressed Cancel!"); 
 
    }

信息录入提示框：返回输入的内容

 
    var name=prompt("请输入您的名字","Bill Gates") 
 
    if (name!=null && name!="") 
 
      { 
 
      document.write("你好！" + name + " 今天过得怎么样？") 
 
      }

计时方法和取消计时，

setTimeout()

未来的某时执行代码

clearTimeout()

取消setTimeout()

cookie 对象用来识别用户。

function setCookie(c_name,value,expiredays)
{
var exdate=new Date()
exdate.setDate(exdate.getDate()+expiredays)
document.cookie=c_name+ "=" +escape(value)+
((expiredays==null) ? "" : ";expires="+exdate.toGMTString())

}

 
 function getCookie(c_name)
 {
 if (document.cookie.length>0)
   {
   c_start=document.cookie.indexOf(c_name + "=")
   if (c_start!=-1)
     { 
     c_start=c_start + c_name.length+1 
     c_end=document.cookie.indexOf(";",c_start)
     if (c_end==-1) c_end=document.cookie.length
     return unescape(document.cookie.substring(c_start,c_end))
     } 
   }
 return ""
 }
  

 
 function checkCookie()
 {
 username=getCookie('username')
 if (username!=null && username!="")
   {alert('Welcome again '+username+'!')}
 else 
   {
   username=prompt('Please enter your name:',"")
   if (username!=null && username!="")
     {
     setCookie('username',username,365)
     }
   }
 }
  