特殊数据类型是: * Undefined
var
a;
alert(a);
alert(b);
NaN是一个特殊的值,含义是
"Not A Number"
-不是一个数字,当将其它值转换成数字失败时会得到这个值
var
str =
"some string here!"
;
var
num = 123;
alert(str*num);
Bool类型转换
var
str =
"some string"
;
alert(!!str);
str =
""
;
alert(!!str);
var
num =0;
alert(!!num);
num=-123.345;
alert(!!num);
alert(
""
*1);
获取变量类型
typeof
运算符
使用window.prompt可以弹出包含输入框的窗口,用户输入的内容将是此函数的返回值
内置对象Math与Date
Date对象像一个时光机
var
d =
new
Date();
Date 对象能够表示的日期范围约等于 1970 年 1 月 1 日前后各 285,616 年。
alert(d);
这个对象有一些方法,可以用来获取时间的各个部分
alert(d.getYear());
alert(d.getFullYear());
alert(d.getMonth());
alert(d.getDate());
alert(d.getDay());
alert(d.getHours());
alert(d.getMinutes());
alert(d.getSeconds());
alert(d.getMilliSeconds());
alert(d.getTime());
返回一个整数值,这个整数代表了从1970年1月1日开始计算到Date对象中的时间之间的毫秒数日期的范围大约是1970年1月1日午夜的前后各285616年,负数代表1970年之前的日期我们不但能从中获取时间值,还可以设置时间值与那些getXXX方法对应的设置时间的函数仅仅是将get改成set
var
d =
new
Date();
d.setFullYear(1690);
alert(d.getFullYear());
alert(d.getTime());
setXXX这样的方法有个最大的好处就是如果我们设置了错误的值,脚本并不会出错,但日期会自动更正
记住,月份是从0开始计数的
数组与对象
Array和Date一样,也是一个内置对象,需要使用
new
运算符创建
var
arr =
new
Array();
JavaScript中数组长度会自动增长,并且length属性会自动更新
arr =
new
Array(6);
还可以使用数组字面量的方式
arr = [];
数组中可以混合存放字符串,数值,布尔值...,几乎所以类型的值,包括数组
arr =
new
Array(1,0,
true
,
"some string"
,
new
Array(
"a"
,3));
alert(arr[4]);
alert(arr[4][0]);
向数组中添加,删除元素(push,
delete
)
arr.push(a);
arr.push(
"a"
,
"b"
);
利用数组长度自动增长的特性
arr[arr.length]=
"new element"
;
使用
delete
与下面的语句效果一样
arr = [
"#"
,
"$"
,
"%"
];
alert(arr);
arr[2]=undefined;
alert(arr);
join方法,返回数组中的所有元素以指的分隔符间隔的字符串
数组和对象是相通的
var
arr =
new
Array();
var
obj =
new
Object();
alert(
typeof
arr);
alert(
typeof
obj);
数组可以使用字符串下标的
var
person =
new
Array();
person[
"age"
] = 18;
person[
"weight"
] =
"123kg"
;
person[
"height"
] =
"170cm"
;
person[
"arm"
] = 2;
person[
"leg"
] = 2;
而对象也可以使用类似语法访问它的属性
var
obj =
new
Object();
obj.property =
"some data"
;
alert(obj[
"property"
]);
obj[1]=123;
alert(obj[1]);
alert(obj.property);
alert(obj.length);
与数组字面量相对应的,也有对象字面量的声明方式
var
obj = {
a:123,
b:456
};
还可以这样写
obj = {
"a"
:345,
"b"
:333
};
for
..
in
...循环出现了 (对于研究对象,
for
in
循环太有用了)
String对象以及一些用于字符串的方法和属性
str =
new
String(
"some string here"
);
str =
"some string here"
;
但由于使用
new
String();所以创建出来的是对象
var
str =
new
String();
alert(
typeof
str);
字符串本身也存这样的方法
有很多用于处理字符串的方法以及一些属性
•length 属性,返回字符串的长度
•indexOf 方法,返回字符串内第一次出现子字符串的字符位置
•lastIndexOf 方法,返回字符串中子字符串最后出现的位置
•charCodeAt 方法,返回一个整数,代表指定位置上字符的 Unicode 编码
•fromCharCode 方法,从一些 Unicode 字符值中返回一个字符串
•replace 方法,进行文字替换,返回替换后的字符串的复制
•substr 方法,返回一个从指定位置开始的指定长度的子字符串
•substring 方法,返回位于 String 对象中指定位置的子字符串
•toLowerCase 方法,返回一个字符串,该字符串中的字母被转换为小写字母
•toUpperCase 方法,返回一个字符串,该字符串中的所有字母都被转化为大写字母
•split 方法,把字符串分割为字符串数组。
Script标签与访问HTML页面
this
对象是一个一直存在的一个对象,它不能被声明(
this
是关键字).这里,
this
就是指
"这个"
,指这个标签!对于HTML中的元素,JavaScript会自动将其解析成一个对象.
推荐将script放在head部分!那么,这就要用到另一个事件onload
window.onload = initAll;
function
initAll() {
var
img = document.getElementById(
"myImg"
);
img.onclick = myFn;
function
myFn() {
alert(
"图象加载完成了!"
);
}
}
这样,代码就不出错了,不管将脚本放在什么位置,initAll只有当页面加载完成后才会被执行
访问HTML页面:HTML DOM
HTML DOM将整个页面当成一个document对象,HTML里的标签都要通过document对象来访问.而文档中的每个标签,
又会转换成一个对象
<p class=
"demo"
title=
"第一个段落:DOM树"
id=
"p1"
>我们用一个p标签来演示</p>
它又会被转换成下面这个对象
{
tagName:
"p"
,
className:
"demo"
,
title:
"第一个段落:DOM树"
,
id:
"p1"
,
innerHTML:
"我们用一个p标签来演示"
}
你也许会奇怪,为什么标签的class属性会变成对象的className属性而不是class.class是JavaScript保留字!!!tagName表示它的标签名,而innerHTML表示它里面的HTML代码
浏览将HTML标签转换成这样的对象后,在JavaScript中访问该标签的属性或里面的内容就简单多了,但问题是如何访问到这个对象!!
*首先要给该标签加个ID,然后使用document.getElementById方法就能够访问到它了注意,要将所要访问HTML页面的代码都放在window的onload事件处理上!
window.onload = initAll;
function
initAll() {
var
p = document.getElementById(
"p1"
);
alert(p.className);
alert(p.tagName);
alert(p.title);
alert(p.id);
alert(p.innerHTML);
}
访问HTML页面就这么简单!获取一个元素之后,不但可以读取它的属性值,还可以设置它的属性值!
利用这些,我们已经能做出一些激动人心的事了!
.over {
color:red;
background:blue;
font-size:larger;
}
.out {
color:black;
background:white;
font-size:smaller;
}
.click {
color:yellow;
background:yellow;
font-size:12px;
}
<p id=
"p1"
class=
"out"
>一大行文字,它们都是普通的文字!</p>
window.onload = initAll;
function
initAll() {
var
p = document.getElementById(
"p1"
);
p.onclick=clickFn;
p.onmouseover = overFn;
p.onmouseout = outFn;
}
function
clickFn() {
this
.className=
"click"
;
}
function
overFn() {
this
.className=
"over"
;
}
function
outFn() {
this
.className=
"out"
;
}
获取页面元素不止这一种方法.document.getElementsByTagName方法也能获取页面元素,顾名思意,它是通过HTML的标签来获取元素的,而不是ID. 因为一张HTML页面,一个ID名称是唯一的,而标签名则大多数是相同的,所以,getElementsByTagName方法只有一个参数,即一个字符串形式的标签名(tagName),而返回值则是一个类似数组的HTML元素列表
window.onload = initAll;
function
initAll() {
var
pList = document.getElementsByTagName(
"P"
);
alert(pList.length);
alert(pList[0].innerHTML);
}
另外,对于document.getElementsByTagName方法,还可以传一个
"*"
号作为参数,以获取页面的所有元素,类似于CSS里面的通配符
window.onload = initAll;
function
initAll() {
var
allThings = document.body.getElementsByTagName(
"*"
);
alert(allThings.length);
alert(allThings[3].innerHTML);
}
javascript:伪协议
伪协议不同于因特网上所真实存在的如http:
javascript:伪协议有个问题,它会将执行结果返回给当然的页面
<a href=
"javascript:window.prompt('输入内容将替换当前页面!','');"
>A</a>
解决方法很简单
<a href=
"javascript:window.prompt('输入内容将替换当前页面!','');undefined;"
>A</a>
尽管javascript伪协议提供了一定的灵活性,但在页面中尽量不要使用!而对于调试JavaScript,javascript伪协议则显得十分有用!