chrome调试工具DevTools的使用 以及 localhost在移动端不能访问的问题
1.手机和pc 都需要装 chrome浏览器
2.手机端打开开发者模式和usb调试
(华为nova的手机小坑,需要选择usb 配置为可传输文件的状态)

3.经过以上操作打开chrome://inspect/#devices 才会看到相应的设备

4.还有一个小问题,就是开发的页面为locasthost的时候,移动端是拿不到这个页面的
这时候我们需要在cmd里ping出电脑本机的ip
使用以下地址 ipconfig/all
即IPv4地址
将localhost替换就可以了
chrome调试工具DevTools的使用 以及 localhost在移动端不能访问的问题的更多相关文章
- 火狐调试工具-DevTools
狐调试工具 - DevTools 咱们做写js 代码的时候,遇到的一个最大的问题就是调试问题,很多开发者在写 js 代码的时候,经常都非常痛苦.但是我们如果掌握好相应的调试工具,那么就可以比较游刃有余 ...
- Chrome调试工具简单介绍
作为前端开发者都知道,快捷键F12可以打开chrome调试工具.firefox可以打开firebug工具.“工欲善其事,必先利其器”,对调试工具的掌握,能大大提高我们调试代码的效率.因为我平常chro ...
- 不常见但很有用的chrome调试工具使用方法
前面的话 对于chrome调试工具,常用的是elements标签.console标签.sources标签和network标签.但实际上,还有一些不太常见但相当实用的方法可以提高网页调试效率.本文将 ...
- chrome调试工具高级不完整使用指南(基础篇)
一.前言 本文记录的是作者在工作上面对chrome的一些使用和情况的分析分享,内容仅代表个人的观点.转发请注明出处(http://www.cnblogs.com/st-leslie/),谢谢合作 二. ...
- chrome调试工具高级不完整使用指南(优化篇)
上一篇文章我们说了chrome调试工具的一些比较基础功能的用法,接下来我们要在这一篇文章中说一说,其他一些chrome调试工具的使用方法 2.1.5 Network模块 在netWork模块中,大致上 ...
- chrome调试工具高级不完整使用指南(实战一)
三.chrome调试工具实战 3.1 获取界面对应的HTML和修改样式 我们以博客园为例子来分析. 通过上面的操作就可以定位到对应的HTML代码 左侧菜单显示的就是当前指定元素层叠样式的一个情况 上面 ...
- chrome调试工具高级不完整使用指南(实战二)
3.3 给页面添加测试脚本 在现实的工作中,我们往往会遇到一些问题在线上就会触发然后本地就触发不了的问题.或者是,要给某个元素写一个测试脚本.这个时候如果是浏览器有提供一个添加脚本的功能的话,那么我们 ...
- chrome通过devtools来查看Devtools Extension与浏览器内核实际通信的数据情况
1.chrome通过devtools来查看Devtools Extension与浏览器内核实际通信的数据情况,步骤如下: (1)开启开发者工具实验模式 ---浏览器进入chrome://flags - ...
- Chrome调试工具Developer Tools——前端必备神器
本文链接:https://blog.csdn.net/u012542647/article/details/79401485 今天要给大家介绍一个神器,就是谷歌浏览器(Chorme)自带的前端调试工具 ...
随机推荐
- 为什么我会选择走 Java 这条路?
阅读本文大概需要 2.8 分钟. 作者:黄小斜 文章来源:微信公众号[程序员江湖] 最近有一些小伙伴问我,为什么当初选择走Java这条路,为什么不做C++.前端之类的方向呢,另外还有一些声音:研究 ...
- ORM中的一对一和多对多
ORM中的一对一和多对多 Django ORM ORM 一对一 什么时候用一对一? 当 一张表的某一些字段查询的比较频繁,另外一些字段查询的不是特别频繁 把不怎么常用的字段 单独拿出来做成一张表 然 ...
- 进阶篇:4)面向装配的设计DFA总章
本章目的:理解装配的重要性,明确结构工程师也要对装配进行设计. 1.基础阅读 ①进阶篇:1)DFMA方法的运用: ②需要一台FDM3d打印机:请查看 基础篇:8)结构设计装备必备: 2.为什么要学习D ...
- 洛谷 P4307 [JSOI2009]球队收益 / 球队预算(最小费用最大流)
题面 luogu 题解 最小费用最大流 先假设剩下\(m\)场比赛,双方全输. 考虑\(i\)赢一局的贡献 \(C_i*(a_i+1)^2+D_i*(b_i-1)^2-C_i*a_i^2-D_i*b_ ...
- webpack 打包之后,两行溢出没有效果
原因:发现-webkit-box-orient:vertical;并未设置成功解决:-webkit-box-orient: vertical; 加上注释包裹 .item-title { overflo ...
- js面向对象(一)——封装
想写这个好久了,自己当时理解这个确实费了一番功夫,现在记录一下,哪怕对读者有一点点帮助,我也很开心,看着不爽大胆喷吧,我脸皮可厚了,闲话不说了,进入正题 ----------------------- ...
- javascript DOM相关语法
childNodes: 获取元素内的所有节点 包括文本节点:nodeType=3 , 元素节点:nodeType = 1 nodeType:它可以判断所有节点的类型 元素节点类型:1 文本节点:3 注 ...
- centos 7编译安装mysql 5.7.17
1.进入MySQL官网下载MySQL源代码 依次点击Downloads -> Community -> MySQL Community Server 源代码1.Select Operati ...
- ETL 工具下载全集 包括 Informatica Datastage Cognos( 持续更新)
Datastage 8.0 BT种子下载:http://files.cnblogs.com/taven/Datastage_8.0.rar Informatica PowerCenter 8.6.0 ...
- 怎么高效查找和正确改变谷歌浏览器编码格式(新版和旧版Google Chrome)(图文详解)
前言 今天,无意中在解决一个乱码问题,后台是有过判断解决兼容性问题,但是有个别电脑还是有乱码问题,就去想改变下前台的编码格式,突然发现一向好用的谷歌,居然找不到编码格式了! 上网百度了半天,查阅各种网 ...