不刷新网页就能链接新的js文件方法总结


Posted in Javascript onMarch 01, 2020

如何不刷新网页就能链接新的js文件,其实在HTML语言中已经有相关的函数了,就是再添加一个<script src=.....></script>。

函数很简单,叫document.body.appendChild(script);

使用方法如下

<!DOCTYPE html><html><head><meta charset="utf-8">
<script language="javascript" >
function myFunction(){ <br>var script = document.createElement("script"); <br>script.src = "cs.js";  <br>document.body.appendChild(script); <br>var t=setTimeout("demo()",10);//这是一个延迟执行函数,以便在新JS添加后再执行新JS里的函数。   }
</script>
</head><body>
<input type="button" onclick="myFunction()" value="显示警告框" />
</body></html>

这是cs.JS

function demo(){
  alert("你好");
}

可以尝试在网页打开后修改cs.js中的你好为其他,然后再点击 显示警示框按钮 便会弹出你修改后的内容而非“你好”

实例扩展:

// 获得要刷新的script
var script = document.getElementById('jQuery');
 
// 刷新JS的方法
function refreshJS(script) {
  var newScript = document.createElement('script');
   
  // 直接加载原地址不会刷新,因为浏览器会缓存, 所以尾部加上时间戳,导致浏览器会认为这是个新地址
  newScript.src = script.src + '?' + new Date().getTime();
  document.body.removeChild(script);
  document.body.appendChild(newScript);
}
 
// 调用
refreshJS(script);

到此这篇关于不刷新网页就能链接新的js文件方法总结的文章就介绍到这了,更多相关如何不刷新网页就能链接新的js文件内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
jQuery on()方法示例及jquery on()方法的优点
Aug 27 Javascript
QQ登录背景闪动效果附效果演示源码下载
Sep 22 Javascript
jQuery文字提示与图片提示效果实现方法
Jul 04 Javascript
JavaScript第一篇之实现按钮全选、功能
Aug 21 Javascript
javascript中的后退和刷新实现方法
Nov 10 Javascript
关于BootStrap modal 在IOS9中不能弹出的解决方法(IOS 9 bootstrap modal ios 9 noticework)
Dec 14 Javascript
详解用vue.js和laravel实现微信支付
Jun 23 Javascript
vue+element实现批量删除功能的示例
Feb 28 Javascript
基于cropper.js封装vue实现在线图片裁剪组件功能
Mar 01 Javascript
ng-zorro-antd 入门初体验
Dec 03 Javascript
jQuery实现checkbox全选、反选及删除等操作的方法详解
Aug 02 jQuery
Vue+Java+Base64实现条码解析的示例
Sep 23 Javascript
vue学习笔记之slot插槽用法实例分析
Feb 29 #Javascript
vue学习笔记之Vue中css动画原理简单示例
Feb 29 #Javascript
Vue组件化开发之通用型弹出框的实现
Feb 28 #Javascript
在vue项目实现一个ctrl+f的搜索功能
Feb 28 #Javascript
Js实现复选框的全选、全不选反选功能代码实例
Feb 28 #Javascript
基于html+css+js实现简易计算器代码实例
Feb 28 #Javascript
JsonServer安装及启动过程图解
Feb 28 #Javascript
You might like
PHP5 操作MySQL数据库基础代码
2009/09/29 PHP
smarty基础之拼接字符串的详解
2013/06/18 PHP
php实现根据词频生成tag云的方法
2015/04/17 PHP
PHP ADODB生成下拉列表框功能示例
2018/05/29 PHP
详解将数据从Laravel传送到vue的四种方式
2019/10/16 PHP
基于jquery的无缝循环新闻列表插件
2011/03/07 Javascript
js中escape对应的C#解码函数 UrlDecode
2012/12/16 Javascript
基于JQuery的列表拖动排序实现代码
2013/10/01 Javascript
图解Sublime Text3使用技巧
2015/12/21 Javascript
nodejs修复ipa处理过的png图片
2016/02/17 NodeJs
jQuery web 组件 后台日历价格、库存设置的代码
2016/10/14 Javascript
vue.js 表格分页ajax 异步加载数据
2016/10/18 Javascript
vue的keep-alive中使用EventBus的方法
2019/04/23 Javascript
layer.open提交子页面的form和layedit文本编辑内容的方法
2019/09/27 Javascript
Python运算符重载用法实例分析
2015/06/01 Python
python对离散变量的one-hot编码方法
2018/07/11 Python
PyQt5实现从主窗口打开子窗口的方法
2019/06/19 Python
python区块及区块链的开发详解
2019/07/03 Python
django实现模板中的字符串文字和自动转义
2020/03/31 Python
Python调用jar包方法实现过程解析
2020/08/11 Python
固特异美国在线轮胎店:Goodyear Tire
2019/02/23 全球购物
碧欧泉Biotherm加拿大官方网站:法国高端护肤品牌
2019/10/18 全球购物
哥德堡通行证:Gothenburg Pass
2019/12/09 全球购物
数组越界问题
2015/10/21 面试题
银行毕业实习自我鉴定
2013/09/19 职场文书
材料加工硕士生求职信
2013/10/10 职场文书
自动化系在校本科生求职信
2013/10/23 职场文书
小孩百日宴答谢词
2014/01/15 职场文书
护士毕业实习感言
2014/03/05 职场文书
项目经理任命书范本
2014/06/05 职场文书
2014年残联工作总结
2014/11/21 职场文书
2015年大学元旦晚会活动策划书
2014/12/09 职场文书
教代会闭幕词
2015/01/28 职场文书
法定代表人资格证明书
2015/06/18 职场文书
公司要求试用期员工提交“述职报告”,该怎么写?
2019/07/17 职场文书
Windows Server 2008 修改远程登录端口以及配置防火墙
2022/04/28 Servers