详解如何让InstantClick兼容MathJax、百度统计等


Posted in Javascript onSeptember 12, 2017

之前有网友提及博客上的LaTex(由MathJax实现)坏掉了,其原因是这里使用了instantclick,以达到网页秒开的效果。但由于instantclick不会重新运行位于head部分的JavaScript代码,而很多工具性软件,比如MathJax、百度统计、Google Analytics、Google Code Prettify等软件都是直接将JS文件插入到head区域。这导致这些工具在instantclick点击后失效,需要重新配置。

配置并不复杂,这些工具本身的代码不用做任何修改,该怎么放还怎么放。但在InstantClick.init();之前添加以下代码:

<script data-no-instant>
InstantClick.on('change', function(isInitialLoad) {
 if (isInitialLoad === false) {
  if (typeof MathJax !== 'undefined') // support MathJax
   MathJax.Hub.Queue(["Typeset",MathJax.Hub]);
  if (typeof prettyPrint !== 'undefined') // support google code prettify
   prettyPrint();
  if (typeof _hmt !== 'undefined') // support 百度统计
   _hmt.push(['_trackPageview', location.pathname + location.search]);
  if (typeof ga !== 'undefined') // support google analytics
    ga('send', 'pageview', location.pathname + location.search);
 }
});
InstantClick.init();
</script>

这段代码的含义是每次页面重载时,通过直接的函数调用来实现MathJax、百度统计、Google Code Prettify、Google Analytics的重新运行。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JavaScript中的Window窗口对象
Jan 16 Javascript
javascript 图片上传预览-兼容标准
Jun 01 Javascript
jquery click([data],fn)使用方法实例介绍
Jul 08 Javascript
整理Javascript数组学习笔记
Nov 29 Javascript
jquery实现轮播图效果
Feb 13 Javascript
vue利用better-scroll实现轮播图与页面滚动详解
Oct 20 Javascript
面包屑导航详解
Dec 07 Javascript
Vue2.0 给Tab标签页和页面切换过渡添加样式的方法
Mar 13 Javascript
在create-react-app中使用sass的方法示例
Oct 01 Javascript
Vue项目实现换肤功能的一种方案分析
Aug 28 Javascript
详解Vue的ref特性的使用
Jan 24 Javascript
详解如何在Javascript中使用Object.freeze()
Oct 18 Javascript
使用InstantClick.js让页面提前加载200ms
Sep 12 #Javascript
VueJs组件prop验证简单介绍
Sep 12 #Javascript
js字符限制(字符截取) 一个中文汉字算两个字符
Sep 12 #Javascript
67 个节约开发时间的前端开发者的工具、库和资源
Sep 12 #Javascript
react-native DatePicker日期选择组件的实现代码
Sep 12 #Javascript
JavaScript中递归实现的方法及其区别
Sep 12 #Javascript
详解react-native-fs插件的使用以及遇到的坑
Sep 12 #Javascript
You might like
php上传文件的增强函数
2010/07/21 PHP
CI框架自动加载session出现报错的解决办法
2014/06/17 PHP
Thinkphp 5.0实现微信企业付款到零钱
2018/09/30 PHP
PHP实现函数内修改外部变量值的方法示例
2018/12/28 PHP
Laravel 5.4前后台分离,通过不同的二级域名访问方法
2019/10/13 PHP
javascript学习笔记(七) js函数介绍
2012/06/19 Javascript
js前台分页显示后端JAVA数据响应
2013/03/18 Javascript
js使下拉列表框可编辑不止是选择
2013/12/12 Javascript
jQuery实现DIV层收缩展开的方法
2015/02/27 Javascript
js记录点击某个按钮的次数-刷新次数为初始状态的实例
2017/02/15 Javascript
VUE 更好的 ajax 上传处理 axios.js实现代码
2017/05/10 Javascript
weex slider实现滑动底部导航功能
2017/08/28 Javascript
JS获取字符对应的ASCII码实例
2017/09/10 Javascript
详解创建自定义的Angular Schematics
2018/06/06 Javascript
vue+iview动态渲染表格详解
2019/03/19 Javascript
深入理解JavaScript 箭头函数
2019/05/30 Javascript
JS中getElementsByClassName与classList兼容性问题解决方案分析
2019/08/07 Javascript
Python导入模块时遇到的错误分析
2017/08/30 Python
浅谈flask源码之请求过程
2018/07/26 Python
pycharm安装和首次使用教程
2018/08/27 Python
Python之循环结构
2019/01/15 Python
下载与当前Chrome对应的chromedriver.exe(用于python+selenium)
2020/01/14 Python
django列表筛选功能的实现代码
2020/03/27 Python
python调用win32接口进行截图的示例
2020/11/11 Python
澳大利亚家具和家居用品在线:BROSA
2017/11/02 全球购物
英国最大的LED专业零售商:Led Hut
2018/03/16 全球购物
国际象棋商店:The Chess Store
2018/07/09 全球购物
新学期家长寄语
2014/01/19 职场文书
党员公开承诺书和承诺事项
2014/03/25 职场文书
建筑公司员工自我鉴定
2014/04/08 职场文书
党员廉洁自律承诺书
2014/05/26 职场文书
中学生的1000字检讨书
2014/10/11 职场文书
2014年精神文明工作总结
2014/12/23 职场文书
科技馆观后感
2015/06/08 职场文书
导游词之徐州云龙湖
2019/11/19 职场文书
你需要掌握的20个Python常用技巧
2022/02/28 Python