源码-JavaScript&jQuery交互式前端开发-第3章-函数、方法与对象-浏览器对象模型

最新推荐文章于 2020-03-01 15:01:32 发布

预见未来to50

最新推荐文章于 2020-03-01 15:01:32 发布

阅读量329

点赞数

分类专栏： Front End Tech 文章标签： CSS JavaScript HTML BOM 浏览器对象模型

本文链接：https://blog.csdn.net/hpdlzu80100/article/details/52677515

版权

Front End Tech 专栏收录该内容

34 篇文章 0 订阅

订阅专栏

Window对象代表当前浏览器中的窗口或标签，位于浏览器对象模型（BOM）中的最顶端。

属性：innerHeight, innerWidth, pageXoffset, pageYoffset, screenX, screenY, location, document, history, history.length, screen, screen.width, screen.height

方法：alert(), open(), print()

示例：显示window对象属性

示例效果：

JS代码：

// Create a variable called msg to hold a message that will be shown on the page
// Find the width of the browser window, and put this in the msg variable
var msg = '<h2>browser window</h2><p>width: ' + window.innerWidth + '</p>';
// Find the height of the window and add it to the msg variable
msg += '<p>height: ' + window.innerHeight + '</p>';
// Find the number of items in the browser window's history and add it to the msg variable
msg += '<h2>history</h2><p>items: ' + window.history.length + '</p>';
// Find the width of the computer screen and add it to the msg variable
msg += '<h2>screen</h2><p>width: ' + window.screen.width + '</p>';
// Find the height of the computer screen and add it to the msg variable
msg += '<p>height: ' + window.screen.height + '</p>';

// Create a variable called el to hold the element whose id attribute has a value of info
var el = document.getElementById('info');
// Write the message into that element
el.innerHTML = msg;
// Find the location of the current page and display it in an alert box
alert('Current page: ' + window.location);

HTML代码：

<!DOCTYPE html>
<html>
  <head>
    <title>JavaScript & jQuery - Chapter 3: Functions, Methods & Objects - Window Object</title>
    <link rel="stylesheet" href="css/c03.css" />
  </head>
  <body>
    <h1>TravelWorthy</h1>
    <div id="info"></div>
    <script src="js/window-object.js"></script>
  </body>
</html>

CSS代码：（参考源码-JavaScript&jQuery交互式前端开发-第3章-函数、方法与对象-使用字面量语法创建对象，http://blog.csdn.net/hpdlzu80100/article/details/52677426 ）

预见未来to50

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
源码-JavaScript&jQuery交互式前端开发-第3章-函数、方法与对象-浏览器对象模型

Window对象代表当前浏览器中的窗口或标签，位于浏览器对象模型（BOM）中的最顶端。属性：innerHeight, innerWidth, pageXoffset, pageYoffset, screenX, screenY, location, document, history, history.length, screen, screen.width, screen.height方
复制链接

扫一扫