在真实手机上运行H5页面时,无法看到控制台。为了能在真实手机上使用控制台,可以加入如下代码实现控制台:
//引入vconsole
var isTestEnvironment =true
if(isTestEnvironment){
var script,
scripts = document.getElementsByTagName('script')[document.getElementsByTagName('script').length-]
function load(url) {
script = document.createElement('script')
script.async = true
script.src = url
scripts.parentNode.insertBefore(script, scripts)
}
//load('https://cdn.bootcss.com/vConsole/3.3.4/vconsole.min.js')
load('../../js-lib/vconsole.min.js')
window.onload = function(){
var vConsole = new VConsole()
}
}
VConsole界面如下:
该代码的要点为:
1.异步加载第三方的js。当无法保证嵌入的第三方内容是否可以正常工作的时候,可考虑用异步加载这些代码,避免阻塞整个页面加载。
上面的代码可以写在公共的js中。
好处是可以按照测试环境和生产环境的不同进行是否加载js的处理,并且避免了每个页面都要加上加载第三方js的