JavaScript基础知识

xman

　　本文主要介绍JavaScript一些基础知识，比较实用，希望能给大家做一个参考。

1、var msg;//声明一个变量，在没有给此变量赋值以前，该变量名为：undefined
2、msg = hello;//不适用var则可以声明一个全局变量，但是此变量因为是全局的，所以容易引起其他调用的一些问题，故不推荐
3、JavaScript有5种基本数据类型，Undefined、Null、Boolean、Number和String；以及一种复杂数据类型：Object
4、var num=076;//代表的八进制，以0开头，假如后面的数值超出8的范围，例：08、079等，则按十进制解析
5、var num=0x22;//代表十六进制
6、NaN-Not a Number;//非数字，NaN不和任何值相等，包托它自己；判断一个值是否可以转换为数值的方式：isNaN(*)，*为所要进行转化的数据
7、向Number转化时，false-0;true-1;-0;00022-22;helloworld-NaN;注：采用的是Number()方式
8、假如采用parseInt()方式进行转化则与7(对字符串来说)不同，基本原理如下：
1)对String的第一个非空格字符进行解析，若是空格则跳过，假如是非数字或者负号，则直接返回NaN;
2)对接下去的字符继续解析，直到遇到非数字或者解析完成，返回已经解析的内容;
3)如果解析到字符串的非空格字符以0x开头且后面加16进制字符则转换成16进制，若是0开头且后面加8进制字符则转换为8进制;
例：1234blue-1234;-NaN;0xA-10;070-56; 22.5-22; 12 457 blue-12;解析时只跳过1)中出现的空格
9、还可以采用parseInt(*,*)方式，后面一个变量代表的是所要转换的进制；可选16,10,8,2等，例parseInt(10,16)-16，此时不需要再添加0x或者0
10、toString()方法一般不必使用参数，true-true,都是按照字符串来转换，但是当由数字转换为String时，可以添加参数，用于设置进制
例：var num = 10-String-------num.toString()-10;num.toString(2)-1010;num.toString(8)-12;
11、在JavaScript中以32位数据表示一个数，左移不会改变符号位，例：25;--64即：10-1000000
12、右移分为两种：有符号右移和无符号右移：
1)有符号右移：只移动数据位，不移动符号位:-645 -----2
2)无符号右移：所有的都要移动，因此负数移动之后会变为正数，且此正数一般非常大
12、switch语句中的case非常强大，可以是数值，也可以是字符串甚至表达式
13、JavaScript中function()中可以不添加参数，对于其来说其实是由arguments[]接收的
14、JavaScript没有块级作用域，如下例子：


代码如下:
if(true)
{
    var color = blue;
}
alert(color);

会打印出blue出来，这个仅限于alert语句是位于全局环境中，但是在类C语言中则不会出现此种情况，一般都会销毁for函数等循环函数除外，在JavaScript中也会销毁。
15、instance of 语句用于判断是否属于某种数据类型，或者某种对象：person instanceof Object //变量person是Object?若是则返回true
16、将变量值设置为null可以解除对此变量的引用，JavaScript的垃圾收集器在下次运行时会将其回收
17、引用类型与类相似，但是不是一码事!创建一个引用类型有两种方法：
1)


代码如下:
var person = new Object();//Object是JavaScript中最常用的一个引用类型
person.name = zhangsan;
person.age = 30;复制代码

2)


代码如下:
var person = {
    name : zhangsan,
    age : 30    //注意此处没有,!
};

3) 是2)与1)的结合


代码如下:

var person = {};
person.name = zhangsan;
person.age = 30;

上述3种方法中第二种是最常用的
18、对象有三种：user-defined-object(用户自定义对象)，native-object(内置对象)和host-object(宿主对象)
其中native-object是内置在JavaScript中的对象，如Array、Math和Date等，而host-object是浏览器提供的对象。
19、JavaScript中打开一个新的窗口用：window.open(url,name,features),这三个参数都是可选择的，说明如下：
1)url是要打开的窗口的地址
2)name是新窗口的名字，可以通过name与新窗口进行通讯
3)features是一个以,分割的字符串，如height:300,width:200，其内容是新窗口的各种属性
20、可以在html文档中直接调用JavaScript功能，这个得使用JavaScript:xxxxxx的方式，其中JavaScript被称为JavaScript伪协议
例，有某方法：function test(){}
a href=JavaScript:test()test/a//此种方法就是使用JavaScript伪协议进行调用JavaScript方法，此种方法非常不提倡，因为不同浏览器对此种伪协议的支持是不一样的。
　　21、很多节点的内容并不在其value中，如：p id=descHello world/p，此时可以用var text = document.getElementById(desc).firstChild.nodeValue;
此处text得到的值为:Hello World
22、在html文档中插入一个新元素的方法：
1)创建一个新的元素（包括其内容等）
2)把这个新元素插入节点数
说明：1)创建新元素的方法：var para = document.createElement(p);//创建一个p/p
此时这个元素已经具有了p的所有属性，但是里面还没有内容，并且并未插入到文档中
然后用var txt = document.createTextNode(text)方法创建一个文本节点内容，将这个文本节点内容插入到p中
2)parent.appendChild(child)//方法可以将某个child元素插入到parent元素下
包括两部分的工作：1-将文本节点插入到p节点下，para.appendChild(txt);2-将p节点插入到其他节点下
23、set和get方法也可以为一个对象设置属性，称之为存储器属性，它可以实现比较复杂的运算，如：


代码如下:
var m = {
    x : 1,//数据属性
    y : 1,
    get r() {return Math.sqrt(this.x*this.x + this.y*this.y);},//存储器属性，此种属性写法：set(或get) 属性名称(param(set方法有)) {函数体}
    set r(newvalue) {
      var oldvalue = Math.sqrt(this.x*this.x + this.y*this.y);
      var radio = newvalue/oldvalue;
      this.x *= ratio;
      this.y *= ratio;
    }
}

24、数组的操作：
1)length属性表示长度
2)join()方法：


代码如下:
var a = [1,2,3];
a.join()-----1,2,3
a.join( );-----1 2 3
a.join();-----123

3)reverse()//将数组中的元素颠倒顺序
代码如下:
var a = [1,2,3];a.reverse().join()---3,2,1

4)sort()//将数组中的元素排序并返回排序后的数组
sort()//按照字母表的顺序进行排序


代码如下:
sort(function(a,b){//a、b指的是数组中的元素
    if(ab)
    {
        return 1;
    }
    else if()
    {
        return -1
    }
    else
    {
        return 0;
    }
}
//此种方法可以自由定义自己所需要的排序方式

5)concat()//创建并返回一个新的数组，它用于连接数组，它连接的是数组中的元素而不是数组本身


代码如下:
var a = [1,2,3]
　　a.concat(4,5)-----[1,2,3,4,5]
　　a.concat([4,5])-----[1,2,3,4,5]
　　a.concat([4,5],[6,7])-----[1,2,3,4,5,6,7]
　　a.concat(4,[5,[6,7]])-----[1,2,3,4,5,[6,7]]

6)slice()返回指定数组的一个片段,可以写两个参数或者一个参数，一个参数代表是从参数当前位置开始一直到结尾，两个参数是指从第一个参数到第二个参数
参数-1，指定了最后一个元素，即倒数第一个元素，而-3则指定了倒数第三个元素


代码如下:
var a = [1,2,3,4,5];
a.slice(0,3);-----[1,2,3]
　　a.slice(3);-----[4,5]
　　a.slice(1,-1);-----[2,3,4]
　　a.slice(-3,-2);-----[3]

25、window.location = http://www.xunns.com///可以用于打开网页
26、setTimeout()//两个参数，一为回调函数，二为回调时间，说明是多少毫秒之后调用此回调函数，如：


代码如下:
setTimeout(function(){alert(Hello World);},2000);//两秒之后弹出对话框
clearTimeout(h);//用于取消setTimeout的调用,var h = setTimeout(func,time);

27、某个元素的单击事件：var tempelement = document.getElementById(xx);tempelement.onclick = function(){alert(Hello);};
28、var nowtime = new Date();nowtime.toLocaleTimeString();可以显示当前时间（注：是时间而不包含日期）
29、setInterval(func,time);//它用来注册指定的时间之后重复调用的函数，func是重复调用的函数，time是指定的时间，单位毫秒
而clearInterval(h);是用于取消注册的事件，其中的h是var h = setInterval(func,time);
30、无论是setTimeout还是setInterval放time设定为0时，都不是立即执行，而是将这个方法放入到队列中，等待前面的状态执行完毕之后才执行
31、window.location.href//可以获得当前document载入的URL地址，window.location.search//可以得到当前文档中?字符后面的内容，一般用于
检测键值对即name=value的情况
32、window的navigator属性可以包含多个属性：
1)appName-----Web浏览区的全称
2)appVersion-----浏览器厂商和版本
3)userAgent-----通常包含appVersion和其他的信息，没有一定的格式
4)platfrom-----在其运行浏览器的操作系统，甚至有可能使硬件
5)onLine-----此属性如果存在的话表示当前浏览器是否连接到网络
6)geolocation-----用于确定用户地理位置信息的接口
33、Screen对象可以获得有关窗口显示的大小和可用的颜色数量的信息
34、window提供了三种对话框
1)alert--提示对话框
2)confirm()-----也是显示一条信息，但是要求用户确定或者取消,例：var correct = confirm(hello world); if(correct){return true}
3)prompt()-----显示一条信息，等待用户输入并返回那个字符串
35、window提供了模态对话框的显示方案：showModalDialog(param1,param2,param3)//
参数一：用以指定提供对话框HTML内容的URL
参数二：可以是一个任意值，这个值在对话框里的脚本中可以通过window.dialogArguments属性的值访问。
参数三：是一个非标准列表，包含以分号隔开的name=value对，如果提供了这个参数就可以配置对话框的尺寸和其他属性，用dialogwidth和dialogheight来
设置对话框窗口的大小，用resizable = yes来允许用户改变窗口大小
36、name属性也可以用来获得某些元素，但是name属性只在少数html元素中有效：表单form,表单元素，iframe和img元素
document.getElementsByName();//获得所有name属性组成的数组
37、由于历史原因，只有form,img和那些有href属性的a，才有document.forms.id//name为form标签的id，其他元素是不可以的
38、getElementsByClassName();可以取得parent节点下的相同的className的子节点
39、Node节点的重要属性说明如下：
1)parentNode-----给节点的父节点，假如是document对象则它的父节点是null
2)childNodes-----只读的类数组节点，它是该节点的子节点
3)firstChild和lastChild，该节点的第一个子节点和最后一个子节点
4)nextSibling、previoursSibling，该节点的兄弟节点的前一个和后一个
5)nodeType-----该节点的节点类型，是返回一个数值，9代表document节点，1代表Element节点，3代表Text节点，8代表Comment节点，11代表DocumentFragment节点
6)nodeValue-----text节点或Comment节点的文本内容
7)nodeName-----元素的标签名，以大写形式表示
40、在Html中可以创建一个可编辑的区域元素，方法：


代码如下:
div id=editor contenteditableClick to Edit/div,可以通过innerHTML属性获取其中的内容；
　　var editor = document.getElementById(editor); alert(editor.innerHTML);//显示所有内容,包括br等

41、window.onload中加载两个function的方法window.onload=function(){
//此处写两个function
func1();
func2();
}
42、对Element设置css属性的方法：


代码如下:
var tip = document.createElement(dd);//创建一个元素
tip.style.cssText = position:absolute;bottom:0;height:20px;width:380px;padding:10px;color:#fff;background:#fff;;//设置元素的css属性