本文实例讲述了JavaScript浏览器对象模型BOM。分享给大家供大家参考，具体如下：
window对象位于BOM层次结构的最顶层。它包含了一些非常重要的子对象，包括location，navigator，document，screen，history。location对象包含当前页面的URL信息。有些信息是只读的，有些信息是可以读写的比如href属性。我们不仅可以通过href属性来获取当前页面的URL信息，还可以通过修改href属性，来跳转到新的页面。
<html> <body> <script type='text/javaScript'> window.location.replace("http://www.baidu.com"); window.location.href="http://www.sina.com"; </script> </body> </html>
history对象保存了用户自打开浏览器以来所访问页面的历史记录。但是某些页面不会被记录下来，比如使用location对象的replace（）方法加载的页面将不会记录在history对象中。
navigator对象表示浏览器自身，它包含了浏览器一些非常有用的信息，比如版本号，浏览器类型以及用户所使用的操作系统。
screen对象包含了客服端显示能力的相关信息。
<html> <body> <script type='text/javascript'> switch(window.screen.colorDepth){ case 1: case 4: document.bgColor = "white"; break; case 8: case 15: case 16: document.bgColor = "blue"; break; case 24: case 32: document.bgColor = "skyblue"; break; default: document.bgColor = "white"; } document.write("Your screen supports "+window.screen.colorDepth + " bit color"); </script> </body> </html>
document是最重要的对象之一。document对象包含了三个数组属性links[],images[],forms[]。这三个数组分别代表了页面中所有由<A>、<img>、<form>所创建对象的集合。
<html> <body> <img name=img1 src="images/1.jpg" border=0 width=200 height=150> <script type='text/javaScript'> var myImages = new Array("images/1.jpg","images/2.jpg","images/3.jpg","images/4.jpg"); var imgIndex = prompt("Enter a number from 0 to 3",""); document.images['img1'].src = myImages[imgIndex]; </script> </body> </html>
<html> <head> <script type='text/javascript'> var imagesArray=new Array("images/1.jpg","images/2.jpg","images/3.jpg","images/4.jpg"); function changeImg(imageNumber){ var newImage = imagesArray[Math.round(Math.random()*3)]; alert(document.images[imageNumber].src); while(document.images[imageNumber].src.indexOf(newImage)!=-1){ newImage = imagesArray[Math.round(Math.random()*3)]; } document.images[imageNumber].src = newImage; return false; } </script> </head> <body> <img name='img1' src="images/1.jpg" width=150 height=200> <img name='img2' src="images/2.jpg" width=150 height=200> </body> </html>
<html> <head> <script type='text/javascript'> function linkPage(){ alert('You Clicked?'); return false; } </script> </head> <body> <A href='http://www.baidu.com' name='link'> Click Me </A> </body> <script type='text/javaScript'> window.document.links['link'].href="http://www.google.com"; </script> <html>
通过这三个数组就能访问到为标记所创建的相应对象，可以通过修改img对象的属性来修改页面的图片，通过修改超链接对象的属性来改变超链接的URL。
希望本文所述对大家JavaScript程序设计有所帮助。
【JavaScript浏览器对象模型BOM(BrowserObjectModel)实例详解】相关文章：
★ JavaSacript中charCodeAt()方法的使用详解
★ JavaScript中的toLocaleLowerCase()方法使用详解