JavaScript的BOM（浏览器对象）基础语法总结

1、window对象是BOM的核心，window对象指当前的浏览器窗口。

window对象方法:

2、history对象记录了用户曾经浏览过的页面(URL)，并可以实现浏览器前进与后退相似导航的功能。

注意:从窗口被打开的那一刻开始记录，每个浏览器窗口、每个标签页乃至每个框架，都有自己的history对象与特定的window对象关联。

//语法

window.history.[属性|方法]

//注意：window可以省略。

//History 对象属性


//History 对象方法

1)length(属性）:返回浏览器历史列表中的URL数量。

//例子：

<script type="text/javascript">

  var HL = window.history.length;

  document.write(HL);

</script>

//使用length属性，当前窗口的浏览历史总长度

2）back()方法，加载 history 列表中的前一个 URL。

//语法

window.history.back();

//注意：等同于点击浏览器的倒退按钮。

//back()也相当于go(-1),代码如下:

window.history.go(-);

3）forward()方法，加载 history 列表中的下一个 URL。

//语法

window.history.forward();

//注意：等价点击前进按钮。

//forward()相当于go(1),代码如下:

window.history.go();

4)go()方法，根据当前所处的页面，加载 history 列表中的某个具体的页面。

//语法

window.history.go(number);

//number参数：


//例子1

window.history.go(-);

//浏览器中，返回当前页面之前浏览过的第二个历史页面

//例子2

window.history.go();

//返回当前页面之后浏览过的第三个历史页面

3、location用于获取或设置窗体的URL，并且可以用于解析URL。

//语法

location.[属性|方法]

//location对象属性图示:


//location 对象属性：


//location 对象方法:


//例子
<script type="text/javascript">
  document.write(window.location.href); 
</script>

//获取当前显示文档的URL,并输出

4、Navigator 对象包含有关浏览器的信息，通常用于检测浏览器与操作系统的版本。

对象属性:

JavaScript的BOM（浏览器对象）基础语法总结

//例子

<script type="text/javascript">

   var browser=navigator.appName;//名称

   var b_version=navigator.appVersion;//版本

   document.write("浏览器名称"+browser);

   document.write("浏览器版本"+b_version);

</script>

//查看浏览器的名称和版本

1）、userAgent返回用户代理头的字符串表示(就是包括浏览器版本信息等的字符串)

//语法

navigator.userAgent



//例子

function validB(){

  var u_agent = navigator.userAgent;

  var B_name="Failed to identify the browser";

  if(u_agent.indexOf("Firefox")>-){ 
  //使用indexOf返回字符，若没有存在变返回-1，所以但返回的值比-1大的时候，证明Firefox存在
    B_name="Firefox"; 
}else if(u_agent.indexOf("Chrome")>-){
 B_name="Chrome"; 
}else if(u_agent.indexOf("MSIE")>-&&u_agent.indexOf("Trident")>-){
 B_name="IE(8-10)"; 
} 
document.write("B_name:"+B_name+"<br>"); 
document.write("u_agent:"+u_agent+"<br>"); } 
//使用userAgent判断使用的是什么浏览器(假设使用的是IE8浏览器),

//运行结果如下图：

5、screen对象用于获取用户的屏幕信息。

//语法

window.screen.属性

//属性：

JavaScript的BOM（浏览器对象）基础语法总结

注意:
1.单位以像素计。
2. window.screen 对象在编写时可以不使用 window 这个前缀。

1）屏幕分辨率的高度与宽度： screen.height 返回屏幕分辨率的高；screen.width 返回屏幕分辨率的宽。

<script type="text/javascript">

  document.write( "屏幕宽度："+screen.width+"px<br />" );

  document.write( "屏幕高度："+screen.height+"px<br />" );

</script>

2）可使用的高度与宽度：screen.availWidth 属性返回访问者屏幕的宽度，以像素计，减去界面特性，比如任务栏; screen.availHeight 属性返回访问者屏幕的高度，以像素计，减去界面特性，比如任务栏。

<script type="text/javascript">

document.write("可用宽度：" + screen.availWidth);

document.write("可用高度：" + screen.availHeight);

</script>

秒客网

JavaScript的BOM（浏览器对象）基础语法总结

相关文章