前端开发笔记（5）js基础

js的作用

1、网页特效
2、用户交互
3、表单提交
4、控制结构和样式

入口函数

window.onload = function(){     内部放js  }

这个函数的意思就是说，当我们页面加载完毕（页面结构样式节点等加载完）之后，采取执行函数体里面的js部分。

所以这句话可以在页面的顶端

<script>    window.onload = function(){        /*要做事，先找人*/        var pic1 = document.getElementById("pic1");        var pic2 = document.getElementById("pic2");        var pic3 = document.getElementById("pic3");        pic1.onclick = function(){            document.body.style.backgroundImage = "url(images/1.jpg)";        }        pic2.onclick = function(){            document.body.style.backgroundImage = "url(images/2.jpg)";        }        pic3.onclick = function(){            document.body.style.backgroundImage = "url(images/3.jpg)";        }    }</script>

间距

padding内边距会影响盒子的大小，行内元素尽量不用上下的padding和margin。
继承的宽度设置padding是不会挤开盒子。

数据类型

javascript的数据类型分为：
字符型、数值型、布尔型、null、undefined
javascript是一个弱类型语言
var aa = 10;
var aa:int = 10;
javascript的变量你给什么值，他就是什么数据类型。

查看类型操作符 —— typeof

var n = 1;typeof n;

函数定义

函数：函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
自定义函数：

function fun(){    alert("我是自定义函数")}fun();  //函数不调用，自己不执行

函数直接量声明：

var fun1 = function(){    alert("直接量声明")}fun1();  //也需要调用

利用Function关键字声明：

var fun2 = new Function("var a = 10; var b = 20; alert(a+b)");fun2();

在函数体内，声明变量，会把该声明提升到函数体的最顶端，只会提升变量声明，不会赋值。

function fun(){    console.log(num);    var num = 20;}

相当于

function fun(){       var num;       console.log(num);       Num = 20;}

下面这个例子的执行结果为：undefine 9

var a = 18;f1();function f1(){    var b=9;    console.log(a);    console.log(b);    var a = '123';}

数组

数组的声明：

var arr = [1,3,5,7,9];var arr = new Array(1,3,5);

使用数组：

var textArr = ["刘备","诸葛亮","赵云","关羽"];console.log(textArr[3])

数组的长度： 数组名.length

遍历数组：

var lis = document.getElementsByTagName("li");  // 得到所有的lifor(var i = 0; i<lis.length; i++) {     if(i%2 == 0) {  // 只有偶数能被2整除         lis[i].style.backgroundColor = "#eee";     }     //鼠标经过li 的时候， 当前的底色变亮     lis[i].onmouseover = function() {         this.className = "current";     }}

数组常用方法：
（1）push : 追加
var arr =[1,3,5] → arr.push(7) → 结果变成 : [1,3,5,7];
（2）unshift：前面插入
var arr = [1,3,5] → arr.unshift(0) → 结果变成 [0,1,3,5]
（3）pop：删除最后一个元素
var arr = [1,3,5] → arr.pop() → 结果 [1,3]
（4）shift：删除第一个元素
var arr = [1,3,5] → arr.shift() → 结果 [3,5]
（5）concat：连接两个数组

var aa = [1,3,5];  var bb = [“a”,”b”,”c”];aa.concat(bb);     结果：  [1,3,5,“a”,”b”,”c”];

（6）join：把数组转换为字符串

var arr = [1,2,3];console.log(arr.join(“-”))    结果就是：  1-2-3    字符串

（7）split：把字符串转为数组

var txt = "aa-bb-cc-dd";console.log(txt.split("-"));