美文网首页
手机页面调试

手机页面调试

作者: sweetBoy_9126 | 来源:发表于2019-01-12 14:06 被阅读12次

开启http-server

手机访问局域网地址

方法1:
使用alert代替console,如果alert不能确定错误原因,那么就在出问题的页面里监听onerroe错误事件,第一个参数是错误信息,第二个是出错误的文件名,第三个是第几行

window.onerror = function(message, file, row){
  alert(message)
  alert(file)
  alert(row)
}

方法2:自己写一个consle区域

  1. 在页面中添加一个div用来显示console的内容,然后自己写一个console方法
<div id="consoleOutput" style="position: fixed; width: 100%; left: 0;bottom: 0;height: 100px; border:1px solid black; background: red;">
<script>
  window.console = {
    log(x){
      let p = document.createElement('p')
      p.innerText = x
      consoleOutput.appendChild(p)
    }
  }
  console.log('hi')
</script>
  1. 使用cConsole库
    2.1. 安装
npm install vconsole

2.2. 引入dist/vconsole.min.js

<script src = "..node_modules/vconsole/dist/vconsole.min.js"></script>

2.3. 使用

<script>
  var vConsole = new VConsole()
  console.log('Hello world')
</script>

相关文章

  • 手机页面调试

    开启http-server 手机访问局域网地址 方法1:使用alert代替console,如果alert不能确定错...

  • 如何调试手机上的页面?

    一. 如何调试手机上的页面 参考safari调试iPhone app web页面进行相关配置,就可以在mac上调试...

  • 关于手机web页面的调试

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

  • 移动端调试

    一、关于spy-debugger 一站式页面调试、抓包工具。远程调试任何手机浏览器页面,任何手机移动端webvie...

  • 调试工具的使用

    开启调试窗口 windows 平台: f12 调试窗口介绍 指针: 选择页面中的元素 手机: 使用移动端界面调试 ...

  • 面向对象01-调试工具

    开启调试窗口 windows 平台: f12 调试窗口介绍 指针: 选择页面中的元素 手机: 使用移动端界面调试 ...

  • 手机页面如何调试

    使用alert

  • 前端手机仿真调试页面

    随着移动设备越来越智能和大前端(骄傲一下,勿喷)时代的到来, 越来越多的网站开始我往移动端普及, 但对前端开发人员...

  • 前端手机页面调试方法

    将手机连接到PC的同一网络 用手机访问PC提供的HTTP服务 log大法调试1)由于手机没有console.log...

  • iPhone手机调试工具Safari

    通过Safari调试手机页面在移动web开发过程中,需要经常考虑调试的问题,以下将对如何在苹果手机的safari浏...

网友评论

      本文标题:手机页面调试

      本文链接:https://www.haomeiwen.com/subject/vetcdqtx.html