javascript基础拾遗(十)

1.支持ES6标准的浏览器
IE10+
Chrome
Safari
Firefox
移动端浏览器统一都支持

需要注意的是,不同浏览器对各个特性的支持也不一样

2.window对象
当前浏览器窗口对象
innerWidth,innerHeight可用于网页显示的净宽高
outerWidth,outerHeight整个浏览器的宽高

console.log(window.innerWidth)
console.log(window.innerHeight)
console.log(window.outerWidth)
console.log(window.outerHeight)

3.navigator对象
当前浏览器信息
appName:浏览器名称
appVersion:浏览器版本
language:浏览器设置的语言
platform:操作系统类型
userAgent:浏览器设置的User-Agent字符串

console.log(navigator.appName)
console.log(navigator.appVersion)
console.log(navigator.language)
console.log(navigator.platform)
console.log(navigator.userAgent)

不同浏览器获取Dom对象的方法可能不同,在做浏览器兼容时,有时会用navigator对象来判断浏览器类型,调用对应的方法,
但是navigator对象很容易被篡改,因此,正确的方法是使用或运算符||
var width = window.innerWidth || document.body.clientWidth

4.screen对象
当前屏幕的信息
width:屏幕宽度
height:高度

5.location对象
当前页面的URL信息

// 协议 http
console.log(location.protocol)
// 域名 localhost:63342
console.log(location.host)
// 端口 63342
console.log(location.port)
// 文件路径 /jqeryMasonry/test.html
console.log(location.pathname)
// 参数 ?_ijt=pk3b0f1bluvaub40g8sp28rdc6
console.log(location.search)

6.document对象
当前页面对象

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<ul id="language-list">
    <li>C</li>
    <li>Python</li>
    <li>JavaScript</li>
</ul>
<script type="text/javascript">
    document.title = "语言列表"
    var language_list = document.getElementsByTagName('li')
    for(var i=0;i<language_list.length;i++){
        console.log(language_list[i].innerHTML)
    }
</script>
</body>
</html>

document.cookie获取客户端浏览器存放的对应该域名的的cookie
cookie是由服务端写到客户端的(key-value),对于一些重要的信息,因为XSS(跨站脚本攻击)的原因,需要禁止javascript访问该cookie,写入的时候应该加入限制httpOnly。

posted on 2017-12-08 13:47  迪米特  阅读(132)  评论(0编辑  收藏  举报

导航