javascript跳转与返回和刷新页面的实例代码


Posted in Javascript onNovember 20, 2019

javascript中window.open()与window.location.href的区别

  • window.open(‘index.html') 表示新增一个窗口打开 index.html 这个页面,并不刷新
  • location.href(‘index.html') 表示在当前窗口重定向到新页面,打开并刷新 index.html 这个页面
  • window.location 是 window 对象的属性,用来替换当前页,也就是重新定位当前页

而window.open 是 window 对象的方法,是用来打开一个新窗口的函数

// 打开新页面
 // 注意:有些浏览器的安全设置会将window.open()屏蔽,例如避免弹出广告窗
 window.open('./index.html');
 // 在原窗口打开新页面
 window.location.href="./index.html";

window.open()详解

window.open ('page.html', 'newwindow', 'height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n o, status=no')

参数解释: 三个参数

window.open 弹出新窗口的命令;

‘page.html' 弹出窗口的文件名;

‘newPage' 弹出窗口的名字(不是文件名),非必须,可用空''代替;

height=100 窗口高度;

width=400 窗口宽度;

top=0 窗口距离屏幕上方的象素值;

left=0 窗口距离屏幕左侧的象素值;

toolbar=no 是否显示工具栏,yes为显示;

menubar=no 是否显示菜单栏,yes为显示;

scrollbars=no 是否显示滚动栏,yes为显示;

resizable=no 是否允许改变窗口大小,yes为允许;

location=no 是否显示地址栏,yes为允许;

status=no 是否显示状态栏内的信息(通常是文件已经打开),yes为允许;

常用的js返回与刷新页面

在此用a标签举例

<a href="javascript: history.back(-1)" rel="external nofollow" >返回上一页</a> 
 <a href="javascript:history.go(-1)" rel="external nofollow" >返回上一页</a> 
 <a href="javascript:history.go(-2)" rel="external nofollow" >返回前两页</a> 
 <a href="javascript:location.reload()" rel="external nofollow" >刷新当前页面</a> 
 <a href="javascript:" rel="external nofollow" onclick="self.location=document.referrer;">返回上一页并刷新</a>

js

// 刷新当前页面
 window.location.Reload();
 self.location.reload();
 window.location.href = window.location.href;

总结

以上所述是小编给大家介绍的javascript跳转与返回和刷新页面的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
JavaScript国旗变换效果代码
Aug 13 Javascript
获取dom元素那些讨厌的位置封装代码
Jun 23 Javascript
JS实现距离上次刷新已过多少秒示例
May 23 Javascript
jQuery插件Validate实现自定义表单验证
Jan 18 Javascript
jQuery、zepto、js常用小技巧
Feb 12 Javascript
Angular+Node生成随机数的方法
Jun 16 Javascript
详解Vue中一种简易路由传参办法
Sep 15 Javascript
详解node child_process模块学习笔记
Jan 24 Javascript
WebPack配置vue多页面的技巧
May 15 Javascript
CKEditor 4.4.1 添加代码高亮显示插件功能教程【使用官方推荐Code Snippet插件】
Jun 14 Javascript
详解vue中在父组件点击按钮触发子组件的事件
Nov 13 Javascript
js实现滚动条自动滚动
Dec 13 Javascript
vant IndexBar实现的城市列表的示例代码
Nov 20 #Javascript
Vue中rem与postcss-pxtorem的应用详解
Nov 20 #Javascript
关于vue利用postcss-pxtorem进行移动端适配的问题
Nov 20 #Javascript
vue3.0中使用postcss-pxtorem的具体方法
Nov 20 #Javascript
基于Vue+ElementUI的省市区地址选择通用组件
Nov 20 #Javascript
解决node.js含有%百分号时发送get请求时浏览器地址自动编码的问题
Nov 20 #Javascript
Node.JS发送http请求批量检查文件中的网页地址、服务是否有效可用
Nov 20 #Javascript
You might like
PHP字符串处理的10个简单方法
2010/06/30 PHP
php excel类 phpExcel使用方法介绍
2010/08/21 PHP
浅谈php中mysql与mysqli的区别分析
2013/06/10 PHP
整理php防注入和XSS攻击通用过滤
2015/09/13 PHP
PHP有序表查找之插值查找算法示例
2018/02/10 PHP
表格 隔行换色升级版
2009/11/07 Javascript
event.srcElement 用法笔记e.target
2009/12/18 Javascript
三种Node.js写文件的方式
2016/03/08 Javascript
js简单获取表单中单选按钮值的方法
2016/08/23 Javascript
javascript中Number的方法小结
2016/11/21 Javascript
实例解析Array和String方法
2016/12/14 Javascript
Javascript实现登录记住用户名和密码功能
2017/03/22 Javascript
基于js文件加载优化(详解)
2018/01/03 Javascript
three.js搭建室内场景教程
2018/12/30 Javascript
jquery实现垂直手风琴导航栏
2020/02/18 jQuery
浅谈Python类里的__init__方法函数,Python类的构造函数
2016/12/10 Python
Python用户推荐系统曼哈顿算法实现完整代码
2017/12/01 Python
Python运维之获取系统CPU信息的实现方法
2018/06/11 Python
Ubuntu18.04中Python2.7与Python3.6环境切换
2019/06/14 Python
python 的 scapy库,实现网卡收发包的例子
2019/07/23 Python
PyQt 图解Qt Designer工具的使用方法
2019/08/06 Python
Python 操作SQLite数据库的示例
2020/10/16 Python
open_basedir restriction in effect. 原因与解决方法
2021/03/14 PHP
HTML5 移动页面自适应手机屏幕四类方法总结
2017/08/17 HTML / CSS
Schecker荷兰:狗狗用品和配件
2019/06/06 全球购物
电子商务专员岗位职责
2013/12/11 职场文书
会计专业求职信范文
2014/03/16 职场文书
一分钟演讲稿
2014/04/30 职场文书
酒店端午节活动方案
2014/08/26 职场文书
党的群众路线教育实践活动批评与自我批评发言稿
2014/10/16 职场文书
高中社区服务活动报告
2015/02/05 职场文书
新娘父亲婚礼致辞
2015/07/27 职场文书
美容院员工规章制度
2015/08/05 职场文书
升职感谢领导的话语及升职感谢信
2019/06/24 职场文书
浅谈JavaScript浅拷贝和深拷贝
2021/11/07 Javascript
python和C/C++混合编程之使用ctypes调用 C/C++的dll
2022/04/29 Python