javascriptDOM

jsDOM

/*
DOM：
功能：
控制HTML内容
1：获取页面元素对象Element
document.getElementById(“id”);
2:修改属性
innerHtml设置标签体的内容
/
/var light = document.getElementById(“light”);
alert(“我要换图片”);
light.src=“img/u2764.jpg”;/
/var title = document.getElementById(“id1”);
alert(“换内容”)
title.innerHTML = “不是凄美刘强东”;/
/
事件：某些组件被执行了某些操作后去出发某些代码的执行
/
/
BOM组件
window
Navigator
Screen
History
Location
/
/

window 窗口对象：

    1：创建
    2：方法
        与弹出框有关的方法
            1：alert()弹出警告框
            2：confirm()确认取消对话框
                如果用户点击确认则值为true
                如果点击取消就会返回flase
            3：prompt()输入框
         与打开关闭有关的方法
            1：close()
            2: open(); 打开一个窗口
          与定时器有关方法
            1：setTimeout();  一次
                参数
                    1：js代码或方法
                    2：毫秒数
            2: clearTimeout(); 取消
            3: setInterval();循环执行
            4：clearInterval(); 取消循环定时器
    3：属性
    4：特点
        1：对象不需要创建就可以直接使用，直接window.方法名()
        2:window可以省略  方法名();
 */
/*alert("hello world!");
window.alert("hello");
//返回值true false
var flag = confirm("确认取消吗？");//用来防止用户误操作
if (flag) {
    alert("欢迎")
}else {
    alert("手别抖")
}
//返回值来获取用户输入
var result = prompt("请输入用户名");
alert(result);*/
/*var newwindow;
document.getElementById("btn").onclick=function (ev) {
    newwindow = open("https://www.baidu.com");
}
document.getElementById("btn1").onclick = function (ev) {
    newwindow.close();//当前窗口  谁调用我我就关谁
}*/

//定时器

/*setTimeout("fun()",3000);
function fun() {
    alert("boom!!!")
}*/
//循环定时器
/*var id = setInterval("fun()",2000);
clearInterval(id);
function fun() {
    alert("BOOM!!!!")
}*/

轮播图：

//reload() 定义一个方法 点击按钮 舒心页面

document.getElementById("btn").onclick = function (ev) {
    //刷新页面
    location.reload();
}
//获取href
var  href = location.href;
alert(href);
//设置href
document.getElementById("btn1").onclick = function (ev) {
    //刷新页面
    location.href="https://www.baidu.com";
}

事件监听机制

概念：某些事件执行了后，触发某些代码的执行
事件源：组件，例如按钮、键盘、鼠标移动等
监听器：代码
注册监听：将事件、事件源、和监听结合起来

常见的事件：

  1：点击事件
    1：单击事件 onclick()
    2:双肩事件 ondbclick()
  2:焦点事件
    1：失去焦点 onblur()
    2:获得焦点 onfocus()
  3:加载事件
    1：onload 一个页面或图片完成加载
  4：鼠标事件
      1：onmousedown 鼠标按钮按下
      2：onmouseup 鼠标松开
      3：onmousemove 鼠标移开
      4：onmouseover 鼠标移动到
      5：mouseout 鼠标移开
   5：键盘事件
      1：onkeydown 键盘按下
      2:onkeyup 键盘松开
      3:onkeypress 键盘按下并松开
    6：选中和改变
        1：inchange
        2:onselect
    7:表单事件
        1：onsubmit