一个人的前端项目,踩过的那些坑,一一道来。

第一道坑ios微信环境下,对于单页应用(spa)项目,会存在document.title不会生效的问题。

终极解决方案,如下:

if((/iphone|ipad/gi).test(window.navigator.appVersion)){
     var $body = $('body');
     document.title = o;
     // hack在微信等webview中无法修改document.title的情况
     var $iframe = $('<iframe src="/favicon.ico"></iframe>').on('load', function() {
     setTimeout(function() {
     $iframe.off('load').remove()
     }, 0)
   }).appendTo($body)
}else{
     document.title = o;
}

【第二道坑】最新的微信JSSDK遇到的问题, spa 生产签名出现的问题

1> ios 微信环境下,对于单页应用(spa)项目,会存在 根绝url,生成的签名失效的问题。发现,直接点击url进去的签名 是没有问题的。

2> android 没有问题的

终极解决方案:把需要用到的签名页面,还是老老实实的换成  .html 页面,去掉路由

【第三道坑】页面切换动画,会执行2次情况,找到原因。发现是 display 和  visibility 的区别。

1>  页面的 display 显示隐藏是导致动画的再次执行

2>  visibility 不会出现这种问题。

【第四道坑】:最新的微信JSSDK, "获取地理位置"

1> android机器出现了在弱wifi的网络情况下,会出现获取失败的情况。(解决方案:开启移动数据包就应该没有问题了)

2> ios 地理位置 弱wifi 网络也没有问题。

【第五道坑】:关于Html5的range的兼容性 问题

  地址:深度挖掘,Html5的 Range 滑动刻度的坑,兼容全平台,将任性进行到底!

百度统计,如何针对单页面结构做统计分析

地址:http://tongji.baidu.com/open/api/more?p=guide_trackPageview

第一步,引入js文件:

var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "//hm.baidu.com/hm.js?d7ac9c8c30d1bf83e99cf6e29c855c09";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();


第二步,针对router做统计:

var currentUrl = window.DDCore.router.getRouter();
currentUrl = '/#!' + currentUrl;
_hmt.push(['_trackPageview', currentUrl]);
原文地址:https://www.cnblogs.com/Kummy/p/4274395.html