您的位置：首页 > Web前端 > JQuery

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

2016-09-27 09:01 941 查看

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 ）

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航