如何在iPhone与iPad上开启firebug

原文:

MARTIN KOOL

games - web - dad - sarien.net - q42 - livejs - handcraft

Web developers targetting HTML5 on iDevices would really benefit from having Web Developer Tools or Firebug on Mobile Safari. Enter Firebug Lite! However, iPads, iPhones and bookmarklets don’t go well together, so I put together this little howto.

All credits to Joe Hewitt for creating Firebug.

  1. Surf to this page on your iPad or iPhone and bookmark it 
  2. Rename the bookmark to “Firebug”. As you can see, the URL is uneditable right now
  3. Tap on this textarea 
  4. Tap it again, choose “Select All” followed by “Copy”
  5. Edit the Firebug bookmarklet, remove the URL and paste the bookmarklet
  6. Choose “Done” (on the virtual keyboard) and you’re all set

Hitting that bookmarklet should give you a fully functioning Firebug at the bottom of your iPad’s viewport, like this:

 

原文中的代码没有显示,为以下代码

javascript:(function(F,i,r,e,b,u,g,L,I,T,E){if(F.getElementById(b))return;E=F[i+'NS']&&F.documentElement.namespaceURI;E=E?F[i+'NS'](E,'script'):F[i]('script');E[r]('id',b);E[r]('src',I+g+T);E[r](b,u);(F[e]('head')[0]||F[e]('body')[0]).appendChild(E);E=new Image;E[r]('src',I+L);})(document,'createElement','setAttribute','getElementsByTagName','FirebugLite','4','firebug-lite.js','releases/lite/latest/skin/xp/sprite.png','https://getfirebug.com/','#startOpened');

 

效果如上所示。

 

添加bookmark的地方如下:

转载于:https://www.cnblogs.com/yaoliang11/p/3288849.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要安装和使用 Firebug,你可以按照以下步骤进行操作: 1. 首先,在你的浏览器中打开一个新的标签页,并进行搜索 "Firebug"。 2. 在搜索结果中,找到适用于你所使用的浏览器的 Firebug 扩展程序。Firebug 支持 Firefox 浏览器和 Chrome 浏览器。 3. 点击扩展程序的下载链接,然后根据浏览器的提示进行安装。 4. 安装完成后,重新启动浏览器。 5. 现在,你应该在浏览器的工具栏或菜单中看到 Firebug 图标。点击它来打开 Firebug。 一旦 Firebug 打开,你可以使用它来检查和调试网页。以下是一些常用的功能: 1. HTML 视图:在 Firebug 的 "HTML" 面板中,你可以查看网页的结构和标签,并对其进行编辑。你还可以在此处查看元素的样式和属性,并更改它们以查看效果。 2. CSS 视图:在 "CSS" 面板中,你可以检查和编辑网页的样式表。你可以选择特定的元素,并更改其样式以实时预览更改。 3. JavaScript 调试:在 "控制台" 面板中,你可以查看 JavaScript 错误、输出和警告。你还可以在此处执行 JavaScript 代码,并在运行时监视变量和函数的值。 4. 网络监视:在 "网络" 面板中,你可以查看网页加载过程中发生的网络请求和响应。你可以查看请求的详细信息,如 URL、状态码、请求头和响应体。 这只是 Firebug 的一些基本功能。它提供了更多强大的调试和分析工具,可以帮助你深入了解网页的性能和行为。你可以通过阅读 Firebug 的官方文档来了解更多详细信息和使用技巧。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值