欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

JavaScript = ECMAscript+DOM+BOM

程序员文章站 2022-05-22 16:41:53
...

JavaScript 的核心 ECMAScript 描述了该语言的语法和基本对象。
DOM 描述了处理网页内容的方法和接口。
BOM 描述了与浏览器进行交互的方法和接口。
JavaScript = ECMAscript+DOM+BOM
            
    
    博客分类: 境-JS JavaScriptECMAscriptDOMBOM 
 

ECMAScript
简单地说,ECMAScript 描述了以下内容:语法、类型、语句、关键字、保留字、运算符、对象。
ECMAScript只是制定了标准,定义了脚本语言的所有属性、方法和对象,并没有涉及脚本语言的具体实现。其他脚本语言(像javascript和Jscript)以 ECMAScript 作为基准来实现功能和扩展,进而发展出了 DOM 和 BOM。

 

BOM的意思是浏览器对象模型(Browser Object Model),就是JavaScript中的window对象。
而DOM就是文档对象模型(Document Object Model),就是JavaScript中的document对象,事实上完整的写法是window.document(因为window可以省略),所以DOM实际上是BOM的一个属性。

下面一张图很好的解释了他们之间的关系:
JavaScript = ECMAscript+DOM+BOM
            
    
    博客分类: 境-JS JavaScriptECMAscriptDOMBOM 
 

window(BOM)内包含document、history、location、navigator、screen等对象,其中document就是DOM!

PS:BOM是浏览器对象模型,包括浏览器的一些操作,如window.open、window.alert、window.close等,BOM介于各个浏览器厂商对浏览器的不同规定,所以兼容性很差。

 

BOM详解:
window对象:
BOM使JavaScript有能力与浏览器“对话”,而对话的桥梁就是window对象。
window对象可以理解成在浏览器在JavaScript中的一个实例。
对window对象属性的操作可以获取或操作网页标签的状态、大小、位置等。
所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。
全局变量是 window 对象的属性。
全局函数是 window 对象的方法。

 

screen对象:
Screen 对象包含有关客户端显示屏幕的信息。
screen对象可以理解成显示器在JavaScript中的一个实例。

 

navigator对象:
Navigator 对象包含有关浏览器的信息。
navigator对象可以理解成当前浏览器(不是网页标签)在JavaScript中的一个实例。

 

location对象:
Location 对象包含有关当前 URL 的信息。
location对象可以理解成当前网页网址在JavaScript中的一个实例。
如果调用location对象的属性则返回对应的值,如果给其赋值则将该属性设置为所赋的值,并将网页链接到新的地址。

<html>
<body>
	<script type="text/javascript">
		alert(location.href);
		location.href = "http://www.baidu.com";
	</script>
	</body>
</html>

 

history对象:
History 对象包含用户(在浏览器窗口中)访问过的 URL。
history对象可以理解成浏览器历史记录在JavaScript中的一个实例。

<html>
	<body>
		<a onclick="history.go(-1);">上一页</a>
	</body>
</html>

 

DOM详解:
每个载入浏览器的 HTML 文档都会成为 Document 对象。
Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。
document对象可以理解为HTML文件在JavaScript中的一个实例。

<html>
	<head>
		<title>Sample Page</title>
	</head>
	<body>
		<p>hello world!</p>
	</body>
</html>

 

这段代码可以用 DOM 绘制成一个节点层次图:
JavaScript = ECMAscript+DOM+BOM
            
    
    博客分类: 境-JS JavaScriptECMAscriptDOMBOM 
 

 

参考链接:

http://www.w3school.com.cn/js/pro_js_history.asp

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

  • JavaScript = ECMAscript+DOM+BOM
            
    
    博客分类: 境-JS JavaScriptECMAscriptDOMBOM 
  • 大小: 36.3 KB
  • JavaScript = ECMAscript+DOM+BOM
            
    
    博客分类: 境-JS JavaScriptECMAscriptDOMBOM 
  • 大小: 1.8 KB
  • JavaScript = ECMAscript+DOM+BOM
            
    
    博客分类: 境-JS JavaScriptECMAscriptDOMBOM 
  • 大小: 1.7 KB