问题标签 [web-developer-toolbar]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
5 回答
39104 浏览

firefox - 如何在 Firefox 中查看“生成的 HTML 代码”?

如果使用 Firebug,我们可以单击 HTML 选项卡,然后单击展开每个元素以查看生成的 HTML 代码。有没有办法将其全部展开或获取纯文本文件?

我只是偶然发现甚至不需要Firebug。我们可以在网页上直接按CTRL-A(全选),然后右键选择“查看选择源”,然后我们会得到一个“当前HTML代码”的纯文本文件,甚至会看到<div>一个<body>如果 Firebug 已打开,则位于标记之前的 Firebug 面板。但这似乎是一种奇怪的调用方式。还有其他方法吗?

更新:生成的 HTML 通常是指 JavaScript 改变 DOM 后的 HTML。它是当前的 DOM 树而不是原始源代码)

0 投票
5 回答
2178 浏览

css - 使用 firefox webdeveloper 工具栏编辑 CSS 时,为什么工具栏打开时有些图片会消失?

我为 HTML 文档编辑和构建样式表的典型工作流程是打开 Firefox Web 开发人员工具栏的 Edit CSS 面板并直接在浏览器窗口中进行编辑。

大多数时候,这就像一个魅力。但是,有时当我打开“编辑 CSS”面板时,某些图像会消失,我不知道为什么。更奇怪的是,有时我在工具栏打开时添加的图像在关闭时不可见。(我说的主要是使用 CSS background-image 规则添加的图像)。

这里有一些例子......

http://kenbrook.org - 如果您打开编辑 CSS 面板,主体背景图像以及几个 div 背景会消失。事实上,我认为几乎所有的 CSS 背景图像图像都消失了。我没有在这个网站上编写标记和大部分样式,但我负责编辑和完成它们。所以知道为什么会这样吗?

http://joelglovier.com - 也检查一下我刚刚构建自己并为其编写样式的这个(现在页面上只有几个元素)。在标题 div 中,我有一个空的 div,我正在将图像放入其中。当 Edit CSS 打开时,图像会按预期显示。然而,当它关闭时,看不到图像,虽然使用萤火虫我可以看到样式肯定被应用并且 div 是它应该在的位置。

有什么解释吗??

0 投票
2 回答
5942 浏览

internet-explorer-6 - IE6 开发者工具栏发生了什么变化?

它应该在这个链接:

http://www.microsoft.com/downloads/en/details.aspx?familyid=E59C3964-672D-4511-BB3E-2D5E1DB91038&displaylang=en

“假定”是有效词!

有任何想法吗?

Microsoft 是否已将其删除或意外断开链接?

0 投票
2 回答
687 浏览

installation - 从 corp. 安装 Firefox 3.6 的 Web 开发者插件。网络

我正在尝试安装 Web 开发者插件,但失败并显示“Web Developer 1.1.8 无法安装,因为它与 Firefox 3.6.13 不兼容”的消息。

我不相信它实际上是不兼容的。相反,我认为问题是因为在验证检查期间安装失败,可能是因为 corp. 网络弄乱了连接。我得到的信息是:

services.addons.mozilla.org 使用了无效的安全证书

当我查看证书时,它是由网络组颁发的,而不是 Mozilla。

有没有办法绕过版本检查以便我可以安装它?

0 投票
3 回答
4044 浏览

css - 使用 IE9 F12 开发工具进行精细的 DOM/CSS 编辑:可能吗?

为了解决烦人的 IE-only 布局和 CSS 问题,我尝试使用 IE9 的开发人员工具来迭代编辑 HTML 和 CSS。理想情况下,我可以与我习惯使用 Firebug 和 Webkit 的 Inspector 进行的 DOM/CSS 操作工作流程相提并论。

换句话说,我希望能够重复编辑单个元素或一组元素的 HTML 和 CSS,然后在屏幕上立即看到我的更改。

我发现了 F12 工具的“整页”编辑功能,您可以在其中编辑整个页面的 HTML 或所有 CSS 作为一个整体,但即使在使用该工具几个小时、阅读在线帮助和许多 Google 搜索之后,我仍然在为我习惯使用 Firebug 的那种更细粒度的编辑而苦苦挣扎。

在我放弃之前,有谁知道如何使用 F12 工具...

  • ...编辑特定元素及其子元素,而不是一次编辑整个页面?(如萤火虫的“编辑 HTML”上下文菜单)
  • ...查看编辑视图中所做的更改会立即显示在浏览器中,而不是必须退出编辑视图才能查看更改?
  • ...在编辑视图中轻松找到当前选定的元素(周围有蓝色方块的元素)?
  • ...删除单个元素?(在萤火虫中,我可以选择元素并单击“删除”)
  • ...向类中添加新样式,而无需在文档中寻找适用于我关心的元素的样式?(在萤火虫中,我可以双击右窗格中的样式)。

如果 IE 的 F12 工具无法实现上述操作,那么是否有一个不错的 DOM/CSS 编辑替代插件?

顺便说一句,我提出这个问题的目的不是抨击 IE9 开发工具(感谢 Microsoft 开箱即用地包含这些工具),而是学习如何更高效地使用它们。

另外顺便说一句,我已经阅读了 20 多个关于 IE 上的 firebug 等价物的 StackOverflow 问题,但其中大多数似乎是关于 javascript 调试和只读 DOM 检查。我没有找到任何关于编写 DOM/CSS 的最新(IE9)。因此,我正在就这个话题提出另一个问题……如果这是一个骗局,我深表歉意。

0 投票
4 回答
511 浏览

css - 为 IE 7 调试网页

我正在测试 IE 7 的网页。我目前正在使用 IE Tester 对其进行测试。我有一个问题,div在其他浏览器上可见的 a 在 IE 7 中不可见。我试图增加z-index以查看这是否是问题,但我没有运气。

我苦苦挣扎的主要原因是因为我无法弄清楚到底出了什么问题,以及为什么div没有像我想要的那样出现。通常我在调试工具(如firebug或 google 和 opera 等价物)的帮助下完成我所有的 css 工作,但我注意到我对 IE Tester 调试器几乎无能为力。

简而言之,是否有一个不错的调试工具可以用来css在 IE 7 中进行调试?

0 投票
1 回答
241 浏览

jquery - Firefox 3.6 插件开发:在 XUL 模板中包含 jquery 使 Webdeveloper 工具栏不稳定

我正在开发一个 Firefox 扩展。我已经包含在我的一个 xul jquery 中。现在,我注意到,在 Firefox 3.6 中,jquery 使 Webdeveloper 工具栏变得不稳定。它消失了!

我已经测试了该var $j = jQuery.noConflict();解决方案,但它对我没有帮助。

其他一些解决方案?

0 投票
3 回答
6990 浏览

firefox - 我可以用什么来勾勒带有可见内边距、边距和边框的 HTML 元素?

我通常会很好地使用 Chrome Web Developer 扩展来勾勒元素,调试我的 CSS 等,当这不符合任务时,我使用 Firefox 版本(原始的,高级版本),但我会真正喜欢的是一个工具,它可以勾勒出元素的“足迹”,显示“核心”元素、它的填充、它的实际宽度的边框和它的边距。

Chrome 或 Firefox 是否有这样的工具?

0 投票
1 回答
182 浏览

jquery - Firefox Web 开发者工具栏导致古怪行为

我正在使用带有 Web Developer(1.1.19) 附加组件和 Firebug 1.8.4 的 Firefox 8。

从 Firefox 6 或 7 开始,它就开始表现得很奇怪。例如,如果我在 URL 字段中输入内容,它会在 URL 历史记录中正确查找匹配项,但在执行此操作时,我输入的 URL 字段会变为空白。

它在填写表格时也有类似的行为。如果我在一个网站上有两个用户帐户并且我开始输入我的电子邮件地址,它会向我显示我的两个用户名。但是,很难选择其中之一,因为我的用户帐户字段将为空。

Firefox 只有大约一半的时间进入这种古怪的模式。重新启动它通常会修复它。

有针对这个的解决方法吗?

Web Developer 插件是否有更新的替代品?我依靠它来完成我的工作。

0 投票
0 回答
626 浏览

google-chrome - 开发人员工具栏打开时,Chrome 中的 Javascript 执行停止

每当我在 Chrome 中进行开发时,在 Chrome 开发人员工具栏打开时尝试执行脚本之前,我都不会遇到问题。当它打开时,并且(例如),我单击一个绑定了事件的元素,工具栏将翻转到“脚本”选项卡并显示我在下面附加的内容。

当我关闭工具栏时,似乎脚本的执行会启动并运行我正在等待的操作。

我应该注意到我的 JS 中没有错误,并且当工具栏关闭时它运行完美。Chrome 设置中必须有一些东西可以在工具栏打开时暂停 javascript 执行。

我已禁用所有扩展并重新启动浏览器无效。

Chrome 开发者工具