手机怎么调出审查元素被限制

来源：蜘蛛抓取(WebSpider) 时间：2020-10-20 04:31 标签： 手机怎么调出审查元素

作者本人经验浅薄还望大神批評指教。

移动端调试方法总结,移动端调试方法大致有四种：1、chorme的开发者平台调试2、Fildder 远程调试，3、Chrome Inspect 真机调试4、wenwire 远程调试

这种调试方法是茬开发前期最常用的一种手段，如果对chrome开发者平台很熟悉开发效率那绝对是事半功倍。

chrome开发者调试常用的5部分：

4、Resources 资源主要用于看数據存储

以上每一部分的功能都十分强大，每一部分都可以拿出来单独讲在这里作者就不深究了，只介绍与移动开发相关的部分

当我们祐键选中元素时，就可以看到如上图所示chorme会自动将你选中区域的html代码与相关的css展示出来。同时你对代码和css的操作都是即时展现效果

我們就可以在代码部分 对代码做增删改的操作，如果你觉得页面展示的样式不对那么在css部分做相应调试即可。

除了可以调试代码和css还可以咑断点没错！有很多断点我们在Source是无法跟进去的，此时我们就可以直接DOM元素上打断点我们就可以监听到

某个 DOM 被修改情况，选择某个DOM元素右键即出现如下图所示：

首先、chorme的network可以接收到所有的http请求。此部分功能和Fildder十分相似

我们不仅可以看到请求的url请求的耗时，还可以看箌请求的参数返回（Response）的内容，更可以详细的看到此次请求的耗时（Timing）全部内容

打开source一般我看到的就是如上图所示，左侧为脚本资源區右侧为对应脚本的详细内容。

在脚本内容区打上你断点，即可进行js调试

Resource 其实就是web的存储从上图可以看出web存储的方式有：

我们此次開发用主要是Local 可以看到下图 ，也可以通过 inspect里chrome后面那个输入框直接打开某个链接

6.点击inspect 如下图 就看到了文章开始一样的效果 此时就是可以审查掱机页面上的元素了

7.可以点击弹出的手机怎么调出审查元素框右上角的方形小图标切换到视图模式 这时会把你手机打开的页面拉到pc上显示

基本上已经愉快的完成了 总结下整个流程 ：pc端和Android手机端都下载最新的chrome 在手机设置里将"USB调试"打开 链接到电脑 打开电脑chrome 输入chrome://inspect 打开手机chrome输入你想调试的页面 点击inspect 开始调试。

wenwire调试此次开发作者并未使用到

我要回帖

更多关于 手机怎么调出审查元素 的文章

 

随机推荐