JS基础语法 day02笔记

一.事件:
定义:事件是可以被 JavaScript 侦测到的行为。 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件
1)常用的事件:
1.onload：当页面或图像加载完后立即触发
2.onblur：元素失去焦点
3.onfocus：元素获得焦点
4.onclick：鼠标点击某个对象
5.onchange：用户改变域的内容
6.onmouseover：鼠标移动到某个元素上
7.onmouseout：鼠标从某个元素上离开
8.onkeyup：某个键盘的键被松开
9.onkeydown：某个键盘的键被按下
2) 1.事件冒泡
微软提出了名为事件冒泡的事件流。事件冒泡可以形象地比喻为把一颗石头投入水中，泡泡会一直从水底冒出水面。也就是说，事件会从最内层的元素开始发生，一直向上传播，直到document对象。
因此上面的例子在事件冒泡的概念下发生click事件的顺序应该是p -> div -> body -> html -> document
2.事件捕获
网景提出另一种事件流名为事件捕获与事件冒泡相反，事件会从最外层开始发生，直到最具体的元素。
上面的例子在事件捕获的概念下发生click事件的顺序应该是document -> html -> body -> div -> p
3) 事件处理程序
1.DOM0 级事件处理程序
不能绑定同一个元素同一个事件多次
2.DOM2级事件程序
可以绑定一个元素的内容多次
addEventListener()和 removeEventListener()。所有 DOM 节点都包含这两个方法，并且他们都接受 3 个参数：要处理的事件名、作为事件处理程序的函数和一个布尔值。最后这个布尔值参数如果是 true，则表示在捕获阶段调用事件处理程序；如果是 false 则表示在冒泡阶段调用事件处理程序。
二.BOM（浏览器对象模型）
定义: BOM是浏览器对象模型，用来获取或设置浏览器的属性、行为，例如：新建窗口、获取屏幕分辨率、浏览器版本号等。
DOM是文档对象模型，用来获取或设置文档中标签的属性，例如获取或者设置input表单的value值。

1. window对象
   1.系统对话框
   浏览器通过（实际是 window 对象的方法）alert()、confirm()、prompt()方法可以调用对话框向用户显示消息。
   a.消息框:alert， 常用。
   alert() 方法用于显示带有一条指定消息和一个 OK 按钮的警告框。
   b.输入框:prompt，返回提示框中的值。
   prompt() 方法用于显示可提示用户进行输入的对话框。
   参数（可选）：
   第一个参数：要在对话框中显示的纯文本。
   第二个参数：默认的输入文本。
   c.确认框:confirm，返回 true/false.
   confirm() 方法用于显示一个带有指定消息和 OK 及取消按钮的对话框。

   2.打开窗口
   window.open()方法既可以导航到一个特定的 URL 也可以用来打开一个新的窗口
   _self、_parent、_top、_blank
   3.关闭窗口
   window.close()：关闭窗口。
   注意:只能关闭被open打开的窗口
   三. 时间函数
   1.setTimeout() : 在指定的毫秒数后调用函数或计算表达式。通过返回的标识也可以
   cliearTimeout(id) 来清除指定函数的执行
   在 times 毫秒后执行 function 指定的方法，执行之前也可以取消
   2.setInterval():可按照指定的周期（以毫秒计）来调用函数或计算表达式，也可根据
   返回的标识用来结束。该方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。
   四.history对象
   1)history 对象的属性：length，返回浏览器历史列表中的 URL 数量。
   2)history 对象的方法：
   1.back()：加载 history 列表中的前一个 URL。
   2.forward()：加载历史列表中的下一个 URL。当页面第一次访问时，还没有下一个 url。
   3.go(number|URL): URL 参数使用的是要访问的 URL。而 number 参数使用的是要访
   问的 URL 在 History 的 URL 列表中的相对位置。go(-1)，到上一个页面
   五.location对象
   1)location 对象的属性 href：设置或返回完整的 URL
   2)location 对象的方法
   1.reload()：重新加载当前文档。
   2.replace()：用新的文档替换当前文档。
   六. Document 对象(DOM的核心对象)
   定义:每个载入浏览器的 HTML 文档都会成为 Document 对象。
   Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。
   Document 对象是 Window 对象的一部分，可通过 window.document 属性对其进行访问。
   document对象的body属性，提供对元素的直接访问，cookie属性，用来设置或返回与当前文档有关的所有cookie，write()方法，向文档写HTML表达式或JavaScript代码。还有其他属性和方法
   七. DOM：Document Object Model(文档对象模型)
   1)节点:
   节点类型 HTML内容 包括
   文档节点 文档本身 整个文档 document
   元素节点 所有的HTML元素 、

   、

   
   属性节点 HTML元素内的属性 id、href、name、class
   文本节点 元素内的文本 hello
   注释节点 HTML中的注释 <!-- –
   2)节点的获取
   预加载事件：等文档中的元素及资源加载完毕后才执行的事件
   1、window.οnlοad=function(){}
   2、在body标签上写onload事件
   html代码从上往下执行，当获取的元素写在dom元素之前时，代码还未走到dom元素，此时无法找到dom对象，会返回null；

    	    获取节点
    		方法						 	描述
   

getElementById() 根据 id 获取 dom 对象，如果 id 重复，那么以第一个为准
getElementsByTagName() 根据标签名获取 dom 对象数组
getElementsByClassName() 根据样式名获取 dom 对象数组
getElementsByName() 根据 name 属性值获取 dom 对象数组，常用于多选获取值
注:javascript:void(0); 伪协议，表示a 标签不执行href属性的跳转行为，而去执行点击事件
javascript:函数名(); 不执行跳转，执行函数