第三章 循环 样式操作

循环

for(var i=0;i<length;i++){
    //相关业务
}
注意：
for(var i =0;i<4;i++){ 该循环做的事情是 循环绑定事件  并没有弹出
    liDoms[i].onclick = function(){
        alert(i);//当点击时 i的值为最后一次循环的值
    }
}
while(条件){
    //相关业务 
}
do{
    //相关业务
}while(条件)

break:跳出当前循环 并结束后边的循环；
continue:跳出当前循环 并执行后边的循环。

---

自定义标签属性

标签存在天生自带的属性，我们可以直接通过对象.属性的方式进行查看。
<div id="box1" class="box2" title="three" pzj="123"></div>
var boxDom = document.genElementById("box1");
//获取
alert(boxDom.id);//box1
alert(boxDom.class);//undefined  class为关键字
alert(boxDom.className);//box2 class属性比较特殊
//设置
boxDom.id = "box2";
boxDom.className = "box1;

alert(boxDom.pzj);//undefined  不是标签自带的
自定义标签属性：写在标签里边的属性，该标签本身不存在的，称为自定义标签属性；（可以看到）
通过：boxDom.setAttribute(属性名，值)
boxDom.getAttribute(属性名)此方法能够获取标签天生自带的属性，同时也能够获取自定义标签属性的值 boxDom.getAttribute("pzj");值为123
boxDomremoveAttribute(属性名)

boxDom.pzj = "234";
alert(boxDom.pzj);//234
自定义属性：给boxDom扩展了一个叫pzj的属性（看不见）

自定义标签属性和自定义属性存在的目的：为了给标签做记号或者存值。

---

样式操作

<div id="box" ></div>
var boxDom = document.genElementById("box");
boxDom.style.width = "100px";//只能写到行内样式中
boxDom.style.marginLeft = "50px";//复合样式 margin-left采用驼峰命名
boxDom.style.cssText = "background:red;height:40px;";//写多条
//如何写到行间
document.getElementsByTagName("style")[0].innerHtml = "";

问题：var bg = "background";
boxDom.style.bg;// 这种写法错误undefined
boxDom.style[bg];//正确
**[]的使用 只要用点的方式都可以用[字符串]的形式**

---

函数的简单认识

var obj = new Object();
alert(obj.constructor);//可以查看构造器

函数的书写方法：
1.定义式：function 函数名（参数）{ }
2.表达式：var 变量名 = function(参数){ }

function add(){
}
//触发
1.add();
2.document.getElementById("btn").onclick = add;
3.document.getElementById("btn").onclick = function(){
    add();
}

function xq(){ }
var xq;
alert(xq);//弹出的是function...

function xq(){ }
var xq = 1;
alert(xq);//弹出的是1
总结：当变量只定义未赋值时，函数名和变量名相同时 函数名的优先级高