JavaScript 浏览器对象(三)

简介:

一、Location对象

    1.location对象:window.location对象用于获取当前页面的地址(URL),并把浏览器重定向到新的页面。

    2.location对象的属性:

      location.hostname返回web主机的域名

      location.pathname返回当前页面的路径和文件名

      location.port返回web主机的端口

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

      location.href属性返回当前页面的url

      location.assign()方法加载新的文档

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<!DOCTYPE html>
<html>
     <head>
         <meta charset= "UTF-8" >
         <title></title>
     </head>
     <body>
         <button id= "btn"  onclick= "getLoc()" >按钮</button>
         <p id= "ptime" ></p>
         <script>
             function  getLoc(){
//              document.getElementById("ptime").innerHTML = window.location.hostname;
//              document.getElementById("ptime").innerHTML = window.location.pathname;
//              document.getElementById("ptime").innerHTML = window.location.port;
//              document.getElementById("ptime").innerHTML = window.location.href;
                 location.assign( "http://www.baidu.com" );
             }
         </script>
     </body>
</html>


二、Screen对象

    1.Screen对象:

      window.screen对象包含有关用户屏幕的信息

    2.属性:

      screen.availWidth-可用的屏幕宽度

      screen.availHeight-可用的屏幕高度

      screen.Height-屏幕高度

      screen.Width-屏幕宽度

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<!DOCTYPE html>
<html>
     <head>
         <meta charset= "UTF-8" >
         <title></title>
     </head>
     <body>
         <button id= "btn"  onclick= "getLoc()" >按钮</button>
         <p id= "ptime" ></p>
         <script>
             document.write( "可用高度:" +screen.availHeight+ ",可用宽度" +screen.availWidth);
             document.write( "高度:" +screen.height+ ",宽度" +screen.width);
         </script>
     </body>
</html>

      


本文转自yeleven 51CTO博客,原文链接:http://blog.51cto.com/11317783/1794366



相关文章
|
20天前
|
存储 JavaScript 索引
js开发:请解释什么是ES6的Map和Set,以及它们与普通对象和数组的区别。
ES6引入了Map和Set数据结构。Map的键可以是任意类型且有序,与对象的字符串或符号键不同;Set存储唯一值,无重复。两者皆可迭代,支持for...of循环。Map有get、set、has、delete等方法,Set有add、delete、has方法。示例展示了Map和Set的基本操作。
23 3
|
21天前
|
JavaScript
浏览器插件crx文件--JS混淆与解密
浏览器插件crx文件--JS混淆与解密
21 0
|
2天前
|
JavaScript 前端开发
在JavaScript中,函数原型(Function Prototype)是一个特殊的对象
JavaScript中的函数原型是一个特殊对象,它为所有函数实例提供共享的方法和属性。每个函数在创建时都有一个`prototype`属性,指向原型对象。利用原型,我们可以向所有实例添加方法和属性,实现继承。例如,我们定义一个`Person`函数,向其原型添加`greet`方法,然后创建实例`john`和`jane`,它们都能调用这个方法。尽管可以直接在原型上添加方法,但推荐在构造函数内部定义以封装数据和逻辑。
8 2
|
2天前
|
JavaScript 前端开发
JavaScript 提供了多种方法来操作 DOM(文档对象模型)
【5月更文挑战第11天】JavaScript 用于DOM操作的方法包括获取元素(getElementById, getElementsByClassName等)、修改内容(innerHTML, innerText, textContent)、改变属性、添加/删除元素(appendChild, removeChild)和调整样式。此外,addEventListener用于监听事件。注意要考虑兼容性和性能当使用这些技术。
6 2
|
6天前
|
存储 JavaScript 前端开发
JavaScript对象方法详解
JavaScript对象方法详解
15 1
|
7天前
|
移动开发 JavaScript 前端开发
javascript监听浏览器离开、进入行为
javascript监听浏览器离开、进入行为
11 0
|
7天前
|
JavaScript
js多维数组去重并使具有相同属性的对象数量相加
js多维数组去重并使具有相同属性的对象数量相加
10 1
|
9天前
|
JavaScript 前端开发 开发者
JavaScript基础入门之浏览器控制台调试输出
本文章是对小白学习js的初级教程,也是我对自己学习经验的一种总结,文章大多采用使用案例加讲解,带动学习的方式.因为我们的天性总是喜欢有及时反馈的事物,但是学习是一个慢长的事情,而有结果的回应,才会更好的促进自己去学习,主要是对于javascript学习中的输出,有个大体上的了解,同时通过教学能够更好的使用浏览器来方便我们去学习和运行代码,也是对自己进行笔记整理,对抓住信息关键点的一种提高.
|
14天前
|
前端开发 JavaScript 数据安全/隐私保护
前端javascript的DOM对象操作技巧,全场景解析(二)
前端javascript的DOM对象操作技巧,全场景解析(二)
|
14天前
|
移动开发 缓存 JavaScript
前端javascript的DOM对象操作技巧,全场景解析(一)
前端javascript的DOM对象操作技巧,全场景解析(一)