07-JS使用过的函数 61-70

61、open

如果你是想打开一个新窗口，你可以使用 JavaScript 中的window.open()方法。例如：

window.open("https://www.google.com", "_blank");

这将在新窗口中打开 Google 的网站。第二个参数 "_blank" 表示在新的窗口中打开链接。你还可以设置窗口的大小、位置等等。

62、back 

back() 方法可加载历史列表中的前一个 URL（如果存在）。

调用该方法的效果等价于点击后退按钮或调用 history.go(-1)。

var btn = document.querySelector('button');
btn.onclick = function () {
    window.history.back();
}

 63、go

back() 方法可加载历史列表中的前一个 URL（如果存在）。

调用该方法的效果等价于点击后退按钮或调用 history.go(-1)。

var btn = document.querySelector('button');
btn.onclick = function () {
    console.log(window.history);
    // history.forward(); // 向前一层;  back后退一层
    history.go(2); // 正负号代表前进还是后退, 数字代表前进后退几层
}

 64、Navigator

Navigator 对象包含有关浏览器的信息。

Navigator 对象属性

属性	说明
appCodeName	返回浏览器的代码名
appName	返回浏览器的名称
appVersion	返回浏览器的平台和版本信息
cookieEnabled	返回指明浏览器中是否启用 cookie 的布尔值
platform	返回运行浏览器的操作系统平台
userAgent	返回由客户机发送服务器的user-agent 头部的值
geolocation	返回浏览器的地理位置信息
language	返回浏览器使用的语言
onLine	返回浏览器是否在线，在线返回 ture，否则返回 false
product	返回浏览器使用的引擎（产品）

Navigator 对象方法

方法	描述
javaEnabled()	指定是否在浏览器中启用Java
taintEnabled()	规定浏览器是否启用数据污点(data tainting)

 65、setTimeout

setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。

提示： 1000 毫秒= 1 秒。

提示： 如果你只想重复执行可以使用 setInterval() 方法。

提示： 使用 clearTimeout() 方法来阻止函数的执行。

console.log('延时器代码之前');
var timer11 = setTimeout(function() {
    // 异步. 延时器 等待固定时间后,调用一次 方法
    console.log('进入延时器了, 只执行一次');
}, 1000); // 第二个参数 时间, 单位是毫秒, 1秒=1000毫秒, 延时器

console.log('延时器代码之后');

 66、setInterval

setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。

setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

提示： 1000 毫秒= 1 秒。

提示： 如果你只想执行一次可以使用 setTimeout() 方法。

var timer12 = setInterval(function() {
    // 定时器 无限循环, 每隔固定的时间,执行一次回调函数,除非清除掉定时器,否则不会停止
    console.log('我一定会回来的');
}, 1000);

67、clearInterval

clearInterval() 方法可取消由 setInterval() 函数设定的定时执行操作。

clearInterval() 方法的参数必须是由 setInterval() 返回的 ID 值。

注意: 要使用 clearInterval() 方法, 在创建执行定时操作时要使用全局变量：

var myVar = setInterval(function(){ myTimer() }, 1000);
 
function myTimer() {
    var d = new Date();
    var t = d.toLocaleTimeString();
    document.getElementById("demo").innerHTML = t;
}
 
function myStopFunction() {
    clearInterval(myVar);
}

以上例程会输出：

 68、innerWidth&&innerHeight

innerHeight 返回窗口的文档显示区的高度，如果有垂直滚动条，也包括滚动条高度。

innerWidth 返回窗口的文档显示区的宽度，如果有水平滚动条，也包括滚动条高度。

innerWidth 和 innerHeight 是只读属性。

注意：使用 outerWidth 和 outerHeight 属性获取浏览器窗口的宽度与高度。

69、offsetWidth&&offsetHeight

offsetWidth 属性是一个只读属性，它返回该元素的像素宽度，宽度包含内边距（padding）和边框（border），不包含外边距（margin），是一个整数，单位是像素 px。

通常，元素的 offsetWidth 是一种元素 CSS 宽度的衡量标准，包括元素的边框、内边距和元素的水平滚动条（如果存在且渲染的话），不包含 :before或 :after 等伪类元素的宽度。

对于文档的 body 对象，它包括代替元素的 CSS 宽度线性总含量高。浮动元素的向下延伸内容宽度是被忽略的。

如果元素被隐藏（例如：元素或者元素的祖先之一的元素的 style.display 被设置为 none），则返回 0。

offsetHeight 属性是一个只读属性，它返回该元素的像素高度，高度包含内边距（padding）和边框（border），不包含外边距（margin），是一个整数，单位是像素 px。

通常，元素的 offsetHeight 是一种元素 CSS 高度的衡量标准，包括元素的边框、内边距和元素的水平滚动条（如果存在且渲染的话），不包含 :before或 :after 等伪类元素的高度。

 

对于文档的 body 对象，它包括代替元素的 CSS 高度线性总含量高。浮动元素的向下延伸内容高度是被忽略的。

如果元素被隐藏（例如：元素或者元素的祖先之一的元素的 style.display 被设置为 none），则返回 0。

 70、offsetTop&&offsetLeft

在不脱标的情况下 offsetTop / offsetLeft 是当前盒子距离最近的定位元素的距离，父元素的padding +  自己的margin

在脱标的情况下 offsetTop / offsetLeft 和父元素就没啥关系了, 只考虑自己本身的 top/left 和 margin