js基础2

1.事件

1）添加事件

点击事件：onclick

添加事件.JPG

2)图片显隐



    
        
        显示隐藏图片

出现：

3）this的用法

在匿名函数中的this就是当前对象
在onclick=demo(this) 就是当前节点
修改内容
this.innerHTML = 'xxx'



    
        
        this的应用

4)改变背景颜色



    
        
        改变背景颜色

5)表单控制



    
        
        表单控制

2.onload函数

window的事件，windows.onload = function () {} 是在整个文档加载完毕之后执行，但是自己写的onclick的点击函数不能写到onload里面，因为内部函数只能在内部使用，不能再外部使用
如果实在是想用，window.lala = function () {}



    
        
        onload函数

3.选项卡

方法一：



    
        
        
        
    
    
        
        
        
        
        王 王 王 王 王 王 王 王 王  王 王 王 王 王 王 王 王
        李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 
        张 张 张 张 张 张 张 张 张 张 张 张 张 张 张 张 张 张 张 张 张  
        刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘

方法二：



    
        
        
        
    
    
        
        
        
        
        王 王 王 王 王 王 王 王 王  王 王 王 王 王 王 王 王
        李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 李 
        张 张 张 张 张 张 张 张 张 张 张 张 张 张 张 张 张 张 张 张 张  
        刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘 刘

2.JPG

4.定时器

定时器：分为两种，一种是周期性定时器，一种是一次性定时器
周期性：每隔5s执行一次函数
一次性：几秒之后执行一次函数，执行完毕定时器结束
var timer = setTimeout(fn, 5000)
5000ms之后执行fn一次。然后结束
销毁定时器 clearTimeout(timer)

一次性：



    
        
        定时器

周期性：



    
        
        周期性定时器

计时器：

5)获取非行内样式

IE浏览器获取非行内样式方式
obj.currentStyle['name']
火狐和谷歌获取方式
getComputedStyle(odiv, null)['width']
获取非行内样式的兼容性写法
function getStyle(obj, name) {
return obj.currentStyle ? obj.currentStyle[name] : getComputedStyle(obj, null)[name]
}

6.BOM操作

window.setTimeout,window.setInterval
window.alert\window.confirm
window.open
window.history(back、go)
history.go(1) 去往下一个网址
history.go(2) 去往下下一个网址（向前）
history.back() 倒退一个网址（向后）
location
href : 读取得到当前的url，设置跳转到指定的url
reload() : 刷新整个页面



    
        
        BOM操作

7.select下拉框和oninput事件

onchange : 事件，用户点击下拉框触发
selectedIndex : 用户点击的option的下标，下标从0开始
options : osel.options 可以得到所有的option对象，这是一个数组
input框的oninput事件，只要内容改变，就会触发



    
        
        select下拉框