JavaScript学习------JavaScript实现

JavaScript实现由三个不同部分组成：核心（ECMAScript）、文档对象模型（DOM）、浏览器对象模型（BOM）。

ECMAScript由ECMA-262定义，提供核心语言功能；
文档对象模型（DOM）提供访问和操作网页内容的方法和接口；
浏览器对象模型（BOM）提供与浏览器交互的方法和接口；

ECMAScript

ECMAScript规定的组成部分：语法、类型、语句、关键字、保留字、操作符、对象。ECMAScript就是对实现该标准规定的各方面内容的语言的描述。

什么是ECMAScript兼容：

支持ECMA-262描述的所有“类型、值、对象、属性、函数及程序句法和语义”。
支持Unicode字符标准。
此外，添加ECMA-262没有描述的“更多类型、值、对象、属性、和函数”，主要是指该标准中没有规定的新对象和对象的新属性。
支持ECMA-262没有定义的“程序和正则表达式语法”。

DOM

文档对象模型（DOM）是针对XML但经过扩展用于HTML的应用程序编程接口（API）。DOM把整个页面映射为一个多层节点结构。HTML或者XML页面中的每个组成部分都是某种类型的节点，这些节点又包含着不同类型的数据。

HTML文档标准模型中，所有内容都是节点：

整个文档都是一个文档节点
每个HTML元素都是元素节点
HTML元素内的文本是文本节点
每个HTML属性都是属性节点
注释为注释节点

<!DOCTYPE html>
<html>
    <head>
        <title>document object model</title>
    </head>
    <body>
        <h1>文档对象模型</h1>
        <p>元素<a href="http://www.baidu.com">百度一下</p>
    </body>
</html>

BOM

BOM缩写为Browser Object Model，简称为浏览器对象模型
BOM提供了独立于内容而与浏览器进行交互的对象
BOM主要用于管理窗口与窗口之间的通信，其核心对象是window，表示浏览器的一个实例 BOM由一系列相关对象构成，并且每个对象都提供了许多方法与属性
BOM提供了一组访问窗口对象的方法，可用来移动窗口位置、改变窗口大小、打开新窗口和关闭窗口、弹出对话框、进行导航及获取客户的一些信息(如浏览器品牌版本、屏幕分辨率)
BOM最强大的功能是它提供了一个访问HTML页面入口------document对象

Window对象：

window对象有双重角色：通过JavaScript访问浏览器窗口的一个对象 ECMAScript规定的Global对象，意味着在网页中定义的任何一个对象、变量、函数都以window作为其Global对象，因此有权访问parseInt()等方法。

window对象同时扮演着ECMAScript和Global对象的角色，因此所有在全局作用域中声明的变量、函数都会变成window对象的属性和方法。

window.setTimeout(expression,milliseconds):指定时间后执行一个函数，在超时期限到达前取消执行使用window.clearTimeout(id):接受一个id表示一个定时器。

window.setInterval(expression,milliseconds):每隔指定时间就执行一次代码，取消使用window.clearInterval(id)。

window.opn():可以导航到一个特定的URL还可以打开一个新的浏览器窗口，通常传递第一个参数，第二个参数是已有窗口或框架的名称，第三个参数是逗号分隔的字符串，用于设置新窗口的特征。

location对象：

location对象提供与当前窗口中加载的文档有关的信息，将URL解析为独立的片段。

示例：

URL：htpp://b.a.com:88/index.php?name=liu&age=20#first

属性	含义	值
protocol	协议	“http:”
hostname	服务器名字	“b.a.com”
port	端口	“88”
pathname	url中主机后的部分	“/index.php”
search	“?”后的部分，又称为查询字符串	?name=liu&age=20
hash	返回“#”之后的内容	“#first”
host	等于hostname+port	“b.a.com:88”
href	当前页面完整URL	“htpp://b.a.com:88/index.php?name=liu&age=20#first”

location.assign(url)：将当前地址放到浏览器历史栈中，单击后退仍可回到该页面，相当于window.location和window.href
location.replace(url)：会从浏览器历史栈中删除本页面，点击后退按钮不能回到该页面
location.reload(force)：重新载入当前页面，force为true时从服务器端重载，为false则从浏览器缓存中重载，默认false

history、screen、navigator对象

history对象保存着用户上网的历史记录，使用go()方法可以在用户历史记录中任意调整，该方法接受一个参数，正数向前跳转，负数向后跳转，字符串跳转指定页面，还可用back()和forward()代替go(),如：

history.go(-1)//后退一页
history.go(2)//前进两页
history.go(“jmi.edu.cn”)//跳转到最近的jmi.edu.cn页面
history.back()//后退一页
history.forward()//前进一页

screen对象包含信息与屏幕显示有关，包括宽度、高度及颜色或像素浓淡，支持以下属性：

availTop(或top)：窗口可放置的最顶部位置，以像素表示
availLeft(或left)：窗口可放置的最左边位置，以像素表示
availWidth(或width)：屏幕宽度，单位为像素
availHeight(或height)：屏幕高度，单位为像素
colorDepth：屏幕颜色深度 pixelDepth:屏幕上每个像素的位元素

navigator对象包含与浏览器或其他访问该页面的用户代理相关信息，可以检查操作系统、浏览器、安全策略、语言及是否启用cookie，支持以下属性：

appCodeName：浏览器代码基础名称
appName：浏览器名称
appVersion：浏览器的主版本号，如1.52主版本号为1.00，子版本号为52(appMinorVersion)
cookieEnabled：cookie是否启用
onLine：用户是否联机
platFrom：浏览器运行的平台
userLanguage：浏览器支持的语言

JavaScript学习------JavaScript实现

ECMAScript

DOM

BOM

猜你喜欢