js页面刷新之实现普通页面
准备面试题目的时候遇到了页面刷新,就整理了一下,网上查找,大概就是八种方法,但是自己测试的时候出现了几个问题,跟大家分享:
首先准备一个测试页面:
<!--html代码-->
<h1 id="test">页面刷新</h1>
<button onclick="fresh()">刷新</button
//script
var h1 = document.getElementById('test');
function test(){
h1.style.color = "red";
h1.innerText = "我变化了";
}
setInterval(test, 1000);
准备工作完成,开始页面刷新方法:
1.可以正常使用的五种方法:
//第一种方法
function fresh(){
window.location.reload();//强迫浏览器刷新当前页面,默认参数为false,表示从客户端缓存里取当前页。如果指定为true,则以GET方式从服务端取最新的页面,相当于客户端点击F5。
}
//第二种方法
function fresh(){
history.go(0);
}
//第三种方法
function fresh(){
location = location;
}
//第四种方法
function fresh(){
location.assign(location);//assign()方法加载一个新的文档。
}
//第五种方法
function fresh(){
location.replace(location);//通过指定URL替换当前缓存在历史里(客户端)的项目,所以使用replace方法之后,不能通过“前进”和“后退”来访问已经被替换的URL。
}
2.只在ie可以执行的两种方法:
//第六种方法
function fresh(){
document.execCommand('Refresh');//是只有IE提供的方法,叫浏览器方法。
}
//第七种方法
function fresh(){
window.navigate(location);//只在ie可以执行,不适用于火狐等其他浏览器。
}
3.网上很容易找到,但是个人认为是错误的一种方法:
//错误方法
function fresh(){
document.URL=location.href;//错误用法,document.URL只能读不能写
}
但是也可以有替代的方法:
//第八种方法
//window.location.href和document.location.href可以被赋值,然后跳转到其它页面
//一个窗口下只有一个window.location.href,但是可能有多个document.URL、document.location.href
function fresh(){
document.location.href = location.href;
//可以使用,document表示的是一个文档对象
}
//第九种方法(与第八种方法是一类)
function fresh(){
window.location.href = location.href;//可以使用,window表示的是一个窗口对象
}
如有错误,请您指正!
js页面刷新之实现普通页面的更多相关文章
- vue中常用的两中页面刷新的方式和页面回退
这个方法的参数是一个整数,意思是在 history 记录中向前或者后退多少步,类似 window.history.go(n) router.push(location) 想要导航到不同的 URL,则使 ...
- Js页面刷新前提示-jquery页面刷新事件
//原理很简单,就是在body的onbeforeunload事件绑定函数,代码如下: document.body.onbeforeunload = function (event) { var c = ...
- html-javascript前端页面刷新重载的方法汇总
记得我在兴安得力实习要转正的时候,我领导象征性的给我出了一套测试题目,里面就有js闭包和页面刷新等题目.今天把很久之前的测试题目之一,js页面刷新的方法以及页面自动刷新跳转和返回上一页和下一页等方法总 ...
- 【转】Hbuilder MUI 页面刷新及页面传值问题
文章来源:http://www.111cn.net/sys/CentOS/67213.htm 一.页面刷新问题 1.父页面A跳转到子页面B,B页面修改数据后再跳回A页面,刷新A页面数据 (1).父页面 ...
- MUI 页面刷新及页面传值问题
一.页面刷新问题 1.父页面A跳转到子页面B,B页面修改数据后再跳回A页面,刷新A页面数据 (1).父页面A代码 window.addEventListener("pageflowrefre ...
- Hbuilder MUI 页面刷新及页面传值问题
一.页面刷新问题 1.父页面A跳转到子页面B,B页面修改数据后再跳回A页面,刷新A页面数据 (1).父页面A代码 window.addEventListener("pageflowrefre ...
- JS定时刷新页面及跳转页面
JS定时刷新页面及跳转页面 Javascript 返回上一页1. Javascript 返回上一页 history.go(-1), 返回两个页面: history.go(-2); 2. history ...
- js中页面刷新和页面跳转的方法总结
.js中cookie的基本用法简介 2009-12-15 js中页面刷新和页面跳转的方法总结 文章分类:Web前端 关键字: javascript js中页面刷新和页面跳转的方法总结 1.histor ...
- 使用ajax和js无刷新改变页面内容和地址栏URL
发现一个可以改变地址栏,而不导致页面刷新的东东. Chrome, FF测试通过,不支持IE. 实现目标 页面的跳转(前进后退,点击等)不重新请求页面 页面URL与页面展现内容一致(符合人们对传统网页的 ...
随机推荐
- 我爱记单词(iWords)之NABC by张恿
1) N (Need 需求) 我们组的项目是做一个英语学习助手,前人的基础上开发新的功能,修改原来功能的bug等等.之前的版本只提供了主动“看单词”和单词测试的功能,我们希望增加背单词的功能,以便更好 ...
- 理解listagg函数
两道SQL面试题引出listagg函数: 1. 用一条sql求出每个部门(emp表)的最大工资和最小工资,以及最大工资和最小工资的员工姓名. (注:一次表扫描.同一个部门最大工资或最小工资的人可能不止 ...
- jquery ajax传递多个对象或数组到后台
1.js对象创建:因为需要把对象json序列化后,才能传递到后台,后台根据json字符串进行反序列化. 2.Jquery $.ajax方法的配置 针对$.ajax方法的配置参数需要进行修改: 1) ...
- Gruntfile.js
module.exports = function(grunt) { grunt.initConfig({ pkg: grunt.file.readJSON('package.json'), clea ...
- 禁止北京地区IP访问站点
<script type="text/javascript" src="http://counter.sina.com.cn/ip" charset=&q ...
- php课程---Windows.open()方法参数详解
Window.open()方法参数详解 1, 最基本的弹出窗口代码 window.open('page.html'); 2, 经过设置后的弹出窗口 window.open('page.html ...
- 封装常用的js(Base.js)——【01】理解库,获取节点,连缀,
封装常用的js(Base.js)——[01]理解库,获取节点,连缀, youjobit07 2014-10-10 15:32:59 前言: 现如今有太多优秀的开源javascript库, ...
- js Memoization 优化运行速度
项目中需要用到 大计算量 耗时的js运算. Memoize 是一个优化方法 ,对耗时的递归运算,漫长的查找运算的结果进行缓存,使运行时间最小化 原理是缓存先前的结果计算值从而可以避免需要重新计算 ...
- UINavigation Bar中使用UIcollectionView,在UIcollectionView的顶端和低端出现空白的问题
在含有UINavigation Bar的视图中,使用UIcollectionView,会在UIcollectionView的顶端和低端出现空白,需要添加下面 一句代码,空白即可消失 //如果不加这 ...
- c# word 转pdf 导出失败,因为此功能尚未安装
savePDF应该是office2007以上的版本才支持的,而且必须是完整版的office. 如果2007提示这个错误,还需要安装一个插件 http://download.microsoft.com/ ...