关于手机web页面的调试

开发手机页面的调试

在开发手机页面时,由于手机浏览器通常没有开发者工具,应该如何来调试呢?

  1. 巧用window.alert()作为断点来代替console.log()
  2. 自己写一个phoneconsole,巧用window.onerror事件
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <style>
    .console{
      position:fixed;
      width:100%;
      bottom:0;
      height:120px;
      background: #ddd;
    }
  </style>
</head>
<body>
<div class="console">
  控制台
  <div id=mylog></div>
  <div id="myerror"></div>
</div>
  <script>
    window.phoneconsole={
      error(){
        window.onerror = function(message, source, lineno, colno, error){
 myerror.innerText='message'+ message+'\n'+'line&row:'+lineno+' '+colno+'\n'+'error'+error
}  
      },
      log(content){
            mylog.innerText='log:'+ content
          }
    }
     phoneconsole.error()
     phoneconsole.log(123)
    //let e=a   这里出了错就会显示
  </script>
</body>
</html>
页面底部就会有个浮动的console
  1. 用别人的库吧
    vconsole
    vconsole
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容