函数传参
案例：改变背景颜色
- 函数传参：参数就是占位符
什么时候用函数传参——函数里定不下来的东西
html
<input type = "button" value = "变蓝” onclick = "setColor('blue')"/>
<input type = "button" value = "变红” onclick = "setColor('red')"/>
<input type = "button" value = "变黄” onclick = "setColor('yellow')"/>
<div id= "div1" style = "200px; height:100px; background:#ccc;></div>
js
function setColor(color){
var oDiv = document.getElementById('div1');
oDiv.style.background = color;
}
改变Div的任意样式：
- 操作属性的第二种方法
什么时候用：要修改的属性不固定
字符串和变量 ：如果字符串不带引号" " ，则会当变量处理
alert("aa")// "aa" : 是字符串；alert(aa) // aa : 是变量
- 将属性名作为参数传递
html
<input type="button" value = "变宽” onclick ="setStyle('width',400)"/>
<input type="button" value = "变高” onclick ="setStyle('height',400)"/>
<input type="button" value = "变绿” onclick ="setStyle('background','green')"/>
<div id = "div1" style = "200px; height:200px; background:pink"></div>
js
function setStyle(name,value){
var oDiv = document.getElementById('div1');
oDiv.style[name] =color;
}
（小注：第一种操作属性的方法是点：oTxt.vlaue = "aabb" ；第二种操作属性的方法是方括号：oTxt['value']="aabb"）
提取事件
- 为元素添加事件
事件和属性一样，可以用js添加
window.onload的意义：网页中的javaScript脚本代码往往需要在文档加载完成后才能够去执行，否则可能导致无法获取对象的情况，为了避免这种情况的发生，可以使用以下两种方式:
一.将脚本代码放在网页的底端，这样在运行脚本代码的时候，可以确保要操作的对象已经加载完成。
二.通过window.onload来执行脚本代码。
第一种方式感觉比较凌乱（其实推荐使用），往往我们需要将脚本代码放在一个更为合适的地方，那么window.onload方式就是一个良好的选择。window.onload是一个事件，当文档加载完成之后就会触发该事件，可以为此事件注册事件处理函数，并将要执行的脚本代码放在事件处理函数中，于是就可以避免获取不到对象的情况。
- 获取一组元素
- getElementsByTagName
for循环
- 用循环为一组元素添加事件
- 什么时候用循环：一组元素
语法：
for(初始值；条件； 自增；）{
语句
}
案例1：
- 全选 ——checked属性
- 不选
- 反选——for循环配合if判断
案例2：
选项卡
- this：当前发生事件的对象
-自定义属性：html不可行，js可行
程序实现分析：
给每个按钮添加点击事件，和自定义属性
给所有按钮清空.active 和 div隐藏
最后给当前点击的按钮添加.active 和显示相应的div
案例3：
简易日历
- 类似选项卡，只是下面只有一个div
- innerHTML的使用 : 可添加标签或文本
- js自定义属性
- “+ ” ：字符串连接：连接两个字符串
- 数组
定义：arr = [1,2,3]
使用：arr[0]
改变Div的任意样式：
- 操作属性的第二种方法
什么时候用：要修改的属性不固定
字符串和变量
alert("aa")// "aa" : 是字符串；alert(aa) // aa : 是变量
- 将属性名作为参数传递