8.5 JavaScript的BOM

2020-12-13 13:53

阅读：472

标签：min conf click height second agent navigator register col

8.5 JavaScript的BOM

即浏览器对象模型(Browser Object Model)

浏览器对象包括
一、Window(窗口)

如果需要打开一个新的网站，应该通过超级链接等方式让用户主动打开，在没有告知用户的前提下就打开一个新的网站会影响用户的体验。

 1 script>
 2     
 3   document.write("文档内容");
 4   document.write("文档显示区域的宽度"+window.innerWidth);
 5   document.write("
");
 6   document.write("文档显示区域的高度"+window.innerHeight);
 7   
 8   document.write("浏览器的宽度:"+window.outerWidth);
 9   document.write("
");
10   document.write("浏览器的高度:"+window.outerHeight);
11   
12   function openNewWindow(){
13   myWindow=window.open("/");
14     }
15 script>
16 button onclick="openNewWindow()">打开一个新的窗口button>

二、Navigator(浏览器)

提供浏览器相关的信息

script type="text/javascript">
document.write("浏览器产品名称：");
document.write(navigator.appName + "");
 
document.write("浏览器版本号：");
document.write(navigator.appVersion + "");
 
document.write("浏览器内部代码：");
document.write(navigator.appCodeName + "");
 
document.write("操作系统：");
document.write(navigator.platform + "");
 
document.write("是否启用Cookies：");
document.write(navigator.cookieEnabled + "");
 
document.write("浏览器的用户代理报头：");
document.write(navigator.userAgent + "");
script>

三、Screen (客户端屏幕)

html>
body>
script type="text/javascript">
document.write("用户的屏幕分辨率: ")
document.write(screen.width + "*" + screen.height)
document.write("
")
document.write("可用区域大小: ")
document.write(screen.availWidth + "*" + screen.availHeight)
document.write("
")
script>
body>
html>

四、History(访问历史)

button onclick="goBack()">返回button>
script>
function goBack()
  {
     history.go(-2); //-1表示上次,默认，-2表示上上次，以次类推
  }
script>
 button onclick="goBack()">返回上上次button>

五、Location(浏览器地址)

span>当前时间:span>
script>
  var d = new Date();
  document.write(d.getHours());
  document.write(":");
  document.write(d.getMinutes());
  document.write(":");
  document.write(d.getSeconds());
  document.write(":");
  document.write(d.getMilliseconds());
 //reload方法刷新当前页面
function refresh(){
  location.reload();
}
//跳转到另一个页面
function jump(){
  //方法1
  //location="/";
 
  //方法2
  location.assign("/");
   }
script>
 br>
button onclick="refresh()">刷新当前页面button>
br>
button onclick="jump()">跳转到首页button>

其他属性（端口号、主机名等）

script>
function p(s){
  document.write(s);
  document.write("
");
}
 
p("协议 location.protocol:"+location.protocol);
p("主机名 location.hostname:"+location.hostname);
p("端口号 (默认是80，没有即表示80端口)location.port:"+location.port);
 
p("主机加端口号 location.host: "+location.host);
p("访问的路径  location.pathname: "+location.pathname);
 
p("锚点 location.hash: "+location.hash);
p("参数列表 location.search: "+location.search);
 
script>

六、弹出框

1、alert弹出框

2、confirm确认对话框

3、prompt输入对话框

script>
//1.alert弹出框
function register(){
   alert("注册成功");
}
//2.确认对话框
function del(){
var d = confirm("是否要删除");
alert(typeof d + " " + d);
}
//3.输入对话框
function p(){
var name = prompt("请输入用户名:");
alert("您输入的用户名是:" + name);
}
script>
br>
button onclick="register()">注册button>
br>
button onclick="del()">删除button>
br>
button onclick="p()">请输入用户名button>

8.5 JavaScript的BOM

标签：min conf click height second agent navigator register col

原文地址：https://www.cnblogs.com/Smileing/p/11543804.html

上一篇：WindowsPhone8中LongListSelector的扩展解决其不能绑定SelectdeItem的问题

下一篇：奇怪的系统：网友自制网页版“Windows 93”

文章来自：搜素材网的编程语言模块，转载请注明文章出处。
文章标题：8.5 JavaScript的BOM
文章链接：http://soscw.com/essay/33447.html

亲，登录后才可以留言！

8.5 JavaScript的BOM

评论

热门文章

推荐文章

最新文章

置顶文章