JavaScript--操作BOM

Posted 2021-08-12 Z && Y

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了JavaScript--操作BOM相关的知识，希望对你有一定的参考价值。

1. 操作BOM

1.1 游览器

在这里插入图片描述

1.2 Window

在这里插入图片描述

1.3 navigator

navigator 对象表示浏览器的信息，最常用的属性包括

navigator.appName：浏览器名称；
navigator.appVersion：浏览器版本；
navigator.language：浏览器设置的语言；
navigator.platform：操作系统类型；
navigator.userAgent：浏览器设定的 User-Agent 字符串。

'use strict'; 
console.log('appName = ' + navigator.appName); 
console.log('appVersion = ' + navigator.appVersion); 
console.log('language = ' + navigator.language); 
console.log('platform = ' + navigator.platform); 
console.log('userAgent = ' + navigator.userAgent);

运行结果:
在这里插入图片描述

请注意， navigator 的信息可以很容易地被用户修改，所以javascript读取的值不一定是正确的。很多初学者为了针对不同浏览器编写不同的代码，喜欢用 if 判断浏览器版本，例如：

在这里插入图片描述

示例:

    alert('猜猜我是谁' || undefined || null || NaN)

在这里插入图片描述

1.4 screen

screen 对象表示屏幕的信息，常用的属性有：

screen.width：屏幕宽度，以像素为单位；
screen.height：屏幕高度，以像素为单位；
screen.colorDepth：返回颜色位数，如8、16、24。

示例:

    alert('Screen size = ' + screen.width + ' x ' + screen.height);

在这里插入图片描述

1.5 location

location 对象表示当前页面的URL信息。例如，一个完整的URL：

对于: http://www.example.com:8080/path/index.html?a=1&b=2#TOP
在这里插入图片描述

1.6 document

在这里插入图片描述
示例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

</body>
<script>
    document.title = "天天天";
</script>
</html>