Javascript BOM学习小结(六)(3)

<body> <input type="button" value="打开"> <input type="button" value="关闭"> <script> function openWin(){ newWin=window.open('http://www.baidu.com', '', 'width=,height=,top='); } function closeWin(){ newWin.close(); } </script> </body>

  实例:检查新窗口是否已关闭

<body> <input type="button" value="打开'"> <input type="button" value="关闭"> <input type="button" value="是否关闭"> <p></p> <script> var newWin; function openWin(){ newWin=window.open('', '', 'width=,height=,top='); } function closeWin(){ if(newWin){ newWin.close(); } } var oP=document.getElementById('p'); function checkWin(){ if(!newWin){ oP.innerHTML='新窗口还没被打开!'; } else{ if(newWin.closed){ oP.innerHTML='新窗口已关闭!'; } else{ oP.innerHTML='新窗口未关闭!'; } } } </script> </body>

4、浏览器信息。

  window.navigator对象获取包含有关访问者浏览器的信息。该属性在使用时可以不加window前缀。

<body> <div></div> <script> txt = '<p>Browser CodeName(浏览器代码名称): ' + navigator.appCodeName + '</p>'; txt+= '<p>Browser Name(浏览器名称): ' + navigator.appName + '</p>'; txt+= '<p>Browser Version(浏览器版本): ' + navigator.appVersion + '</p>'; txt+= '<p>Cookies Enabled(启用Cookies): ' + navigator.cookieEnabled + '</p>'; txt+= '<p>Platform(操作平台): ' + navigator.platform + '</p>'; txt+= '<p>User-agent header(由客户机发送服务器的 user-agent 头部信息): ' + navigator.userAgent + '</p>'; txt+= '<p>User-agent language(客户机代理语言): ' + navigator.systemLanguage + '</p>'; document.getElementById('div').innerHTML=txt; </script> </body>

  其中最常用的属性是navigator.userAgent,返回用户代理头的字符串表示(就是包括浏览器版本信息等的字符串),是识别浏览器的关键,可用于获取当前浏览器版本信息,判断浏览器的类型。

<script> document.write(navigator.userAgent); </script>

  实例:简单的判断浏览器类型

<script> document.write('操作平台:' + navigator.platform); function userBrowser(){ var name = window.navigator.userAgent; //IE浏览器 //判断IE和非IE可以使用ActiveXObject,只有IE支持该对象 //在IE中window.ActiveXObject返回一个对象,则判断为true //其他浏览器都返回undefine,两个否返回false,进入或判断,也返回false if(!!window.ActiveXObject || 'ActiveXObject' in window){ return 'IE浏览器'; } //FF浏览器 else if(name.indexOf('Firefox') > -){ return 'Firefox浏览器'; } //Chrome浏览器 else if(name.indexOf('Chrome') > -){ return 'Chrome浏览器'; } //Opera浏览器 else if(name.indexOf('Opera') > -){ return 'Opera浏览器'; } //Safari浏览器 else if(name.indexOf('Safari') > -){ return 'Safari浏览器'; } else{ return 'unknow'; } } alert('浏览器类型为:' + userBrowser()); </script>

5、页面地址

  window.location对象用于获得当前页面的地址 (URL),并把浏览器重定向到新的页面,简单说就是可以给赋值,像使用open一样。

  语法:location.[属性|方法]

<script> //当前页面URL。若中间出现乱码百分号是中文转码后的显示。 document.write(window.location); </script> <input type="button" value="点击查看"> </body>

  location对象其他应用:

  (1)、location对象属性

    location.hash  设置或返回从井号(#)开始的 URL(锚)。

    location.href  设置或返回完整的 URL。

    location.pathname  设置或返回当前 URL 的路径部分。

    location.host  设置或返回主机名和当前 URL 的端口号。

    location.hostname  设置或返回当前 URL 的主机名,不包含端口。

    location.port  设置或返回当前 URL 的端口号 (80 或 443)。

    location.protocol  返回所使用的 web 协议( 或 https://)。

    location.search  设置或返回从问号(?)开始的 URL(查询部分)。

  (2)、location对象方法

    实例:加载一个新文档

<input type="button" value="点击加载"> <script> function newDoc(){ window.location.assign('http://www.baidu.com') } </script>

实例:重新载入当前文档

<input type="button" value="点击载入"> <script> function reloadPage(){ location.reload() } </script>

实例:用新的文档替换当前文档

<input type="button" value="点击替换"> <script> function replaceDoc(){ window.location.replace('http://www.baidu.com') } </script>

6、浏览器尺寸。

  window.screen对象用于获取用户的屏幕信息。在使用时候可以不加window前缀。

  (1)、屏幕分辨率的宽度和高度

  screen.colorDepth返回用户浏览器表示的颜色位数,通常为32位(每像素的位数)。

  screen.width和screen.height返回屏幕分辨率的宽度和高度。

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wgzddw.html