JavaScript组成BOM和DOM

一、JavaScript的组成

ECMAScript : javascript标准浏览器ES6

二、BOM : 浏览器对象模型，提供了独立于内容，而与浏览器窗口进行交互的对象，主要用于管理窗口与窗口之间的通讯，因此其核心的对象是window，BOM是由一系列的相关对象构成，并且每个对象都提供了很多的方法与属性

window对象：他是ECMAscript规定的全局global对象，又是JavaScript访问浏览器窗口的一个接口

系统对话框 alert()

confirm()

prompt()

移动窗口，调整窗口大小

导航和打开窗口

时序相关的函数

所有全局的变量都是window属性

	<script type="text/javascript">
		//所有全局的变量都是window属性
		var str="张三";
		console.log(str);
		console.log(window.str);
		//这个验证了只有全局变量可以用window调用，而局部中的属性不能用window调用
		function test(){
			var age = 18;
			console.log(age);
		}
//		console.log(age);//报错
//		console.log(window.age);//undefined
		test();
	</script>

所有全局的函数都是window方法

	<script type="text/javascript">
		//所有全局的函数都是window方法
		//定义一个函数
		function func(){
			console.log("111");
		}
		func();//输出111
		window.func();//输出111
	</script>

这里就会有一个问题，我们直接调用就可以，为什么还要用到window调用，当我们设计到模块化，多页面的调用时，就要用到这个。

document对象：每个载入浏览器的HTML文档都会成为document对象，可以对HTML页面中所有进行访问，常用的有增删改查

document对象是window对象的一部分，可通过window.document属性对其进行访问

	<script type="text/javascript">
		console.log(window.document);	
	</script>

document对象常用的对象方法：

write()：向文档写入HTML，表达式或者js代码

writeln()：向文档写入HTML，表达式或者js代码,在每个表达式之后写入一个换行符

open():打开一个流，write()方法的输出流

close():关闭用open()打开的输出流

getElementById()，getElementsByName()

三、事件

js是以事件的驱动为核心的一门语言

事件的三要素：事件源、事件、事件驱动程序

获取事件源，绑定事件，书写事件驱动程序

事件源：相当于一个灯的开关，js中主要指DOM对象，如：div ,span,button等标签

事件：按下，js中常见的事件按下，鼠标经过，鼠标移动，键盘按

事件驱动：灯亮了，js中常见的添加，删除

获取事件源：获取div等通过document.getElementsByName("name");

绑定事件：document.getElementsByName("name");
box.onclick=function(){
//程序
}

DOM : 文档对象模型

JavaScript组成BOM和DOM

猜你喜欢