window事件
window事件是较为重要的事件,接下来就讲解一下。
1.获取页面滚动栏的距离
什么是滚动栏,就是网页内容过多时,通过滚轮控制上下显示或者左右显示;
为窗口添加滚动条事件:
window.onscroll=function(){};
注意在获取滚动条距离的时候
谷歌不识别document.documentElement.scrollTop,必须要加上document.body.scrollTop;即
var scrolltop=document.documentElement.scrollTop||document.body.scrollTop;
这样才能兼容各个浏览器。
这个事件一般用作当页面滚动到某个距离时才出发某个事件的情况,
比如京东的导航条:
以及滑到底部的时候出发一个回到顶部的事件
几种打开新超链接的方式:
1.替换当前窗口,可后退
html写法:<a href="http://www.baidu.com" target="_self">
效果:

JS写法:<a href="javascript:open('http://www.baidu.com','_self')">替换当前窗口,可后退</a>
效果:

2.替换当前窗口不可后退
html无法做到;
JS写法:<a href="javascript:location.replace('http://www.baidu.com')">替换当前窗口,不可后退</a>
效果:
3.在新窗口打开,可以打开多个
html写法:<a href="http://www.baidu.com" target="_blank">在新窗口打开,可以打开多个</a>
效果:

JS写法:<a href="javascript:open('http://www.baidu.com','_blank')">在新窗口打开,可以打开多个</a>
效果:

4.在新窗口打开,只能打开一个
html写法:<a href="http://www.bailiban.com" target="bailiban">新窗口打开,只能打开一个</a>
效果:
JS写法:<a href="javascript:open('http://www.bailiban.com','k')" >新窗口打开,只能打开一个</a>
效果:

注意:
打开窗口语法:
var newWindow = window.open(url,name,网页信息)
name页面的名称,不能省略
window.close() 注意有些浏览器不允许关闭自身
设计好的一些name属性:
_self 自动获取当前窗口的name
_blank 不让浏览器的name为空
上述中只打开一个页面的操作就是name值带来的,类似于给前面的网址取了一个名字,通过name值来打开网页

window事件的更多相关文章
- JavaScript 获取按键,并屏蔽系统 Window 事件
// JavaScript 获取按键,并屏蔽系统 Window 事件 window.document.onkeydown = onkeydown; function onkeydown(event) ...
- angular 使用window事件
1. 使用host 2. 使用HostListener 推荐使用第二种方式. 不推荐下面的方法,虽然也能进行window事件的绑定,但组件销毁后,window事件任然保留,即使手动在组件的ngOn ...
- (非妙味3):浏览器window事件:及浏览各种尺寸介绍
(触发)window.onload; window.onscroll; window.onresize; (兼容)网页可视区尺寸.网页全文尺寸.滚动距离 (实例)广告块高度动态居中.回到顶部 ...
- 加载window事件
$(document).ready()和window.onload的区别 发表于 2012-08-29 由 admin 以浏览器装载文档为例,在页面加载完毕后,浏览器会通过JavaScript为DOM ...
- WPF中常用的Window事件
官方链接:https://msdn.microsoft.com/en-us/library/system.windows.window.statechanged(v=vs.110).aspx 1. A ...
- angular4 使用window事件
Angular使用window对象中的事件最好不要像使用jQuery那样使用 如下: 注:写事件直接绑定到window对象上了,组件销毁时这个事件没有解绑 可以使用剪头函数不用声明that 注:这样写 ...
- jquery自定义window事件
<body> <a href='https://www.baidu.com/'>百度</a> </body> <script type=" ...
- window对象,BOM,window事件,延时器,DOM
01.定时器补充 function fn(){ console.log(1);}setInterval("fn()",100); //定时器调用匿名函数/* funct ...
- js window事件解析(转载)
js-window对象的方法和属性资料 hxpd 发表于 2007-05-08 21:58:18 熟练window对象的open.close.alert.confirm.prompt.setTimeo ...
随机推荐
- flutter State管理
import 'package:flutter/material.dart'; import 'package:scoped_model/scoped_model.dart'; class State ...
- 【转载】 clusterdata-2011-2 谷歌集群数据分析(三)
原文地址: https://blog.csdn.net/yangss123/article/details/78306270 由于原文声明其原创文章不得允许不可转载,故这里没有转载其正文内容. --- ...
- linux安装6.5.3版本elastic search
到官网https://www.elastic.co/cn/downloads/elasticsearch下载压缩包,目前最新的版本是7.3.2,我想下6.5.3,点击下面的past release链接 ...
- VMware Workstation 将虚拟机挂起后,电脑会很卡,SCSI转换成IDE就可以了
摘自:http://www.360doc.com/content/15/0405/09/10098873_460727712.shtml 用过 VMware Workstation 的人,不知道有没有 ...
- 实现Modbus TCP多网段客户端应用
对于Modbus TCP来说与Modbus RTU和Modbus ASCII有比较大的区别,因为它是运行于以太网链路之上,是运行于TCP/IP协议之上的一种应用层协议.在协议栈的前两个版本中,Modb ...
- 【JS新手教程】LODOP打印复选框选中的内容
在html中,复选框是常见的使用之一,本文介绍如何获取选中的复选框的值,并用LODOP打印.给需要为一组的复选框,复选框的checkbox设置相同的name属性,设置不同的id,然后设置需要的valu ...
- IE6利用iframe遮挡 弹层 select
ie6的老bug了,select老是会挡住 弹层里的内容. 解决办法:(box需要设置高度) <div class="box"> <!--[if IE 6]> ...
- 10点睛Spring4.1-Application Event
10.1 Application Event Spring使用Application Event给bean之间的消息通讯提供了手段 应按照如下部分实现bean之间的消息通讯 继承Application ...
- Selenium WebDriver原理
WebDriver原理 WebDriver是按照Server-Client的经典设计模式设计的. Server端就是RemoteServer,可以是任意的浏览器,当我们的脚本启动浏览器后,该浏览器就是 ...
- jenkins集成robot用例并发送自定义报告
slave

