使用开发人员工具/Firebug 更新文件
有没有办法可以将 Chrome 开发人员工具或 Firebug 中所做的更改直接保存到文件中?假设我拥有该文件的读/写访问权限。
或者,是否有任何开发工具可以以类似的方式(或类似的 UI)更新更改?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
有没有办法可以将 Chrome 开发人员工具或 Firebug 中所做的更改直接保存到文件中?假设我拥有该文件的读/写访问权限。
或者,是否有任何开发工具可以以类似的方式(或类似的 UI)更新更改?
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
接受
或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
发布评论
评论(4)
在 Chrome 开发工具中,可以从“源”面板保存更改的 CSS 和 JavaScript 文件,并查看对这些文件进行了哪些更改(差异)。
例如:
在“源”面板中打开 JavaScript 或 CSS 文件。
单击源代码。
进行更改。
按 Command-S 或 Ctrl-S 保存更改。
右键单击源代码(或在“源”面板源树中)并选择本地修改以查看版本控制。
右键单击,选择“另存为...”,然后选择磁盘上的位置来保存文件。后续保存将保存到此位置。
In the Chrome Dev Tools, it's possible to save changed CSS and JavaScript files from the Sources panel, and see what changes (diffs) have been made to those files.
For example:
Open a JavaScript or CSS file in the Sources panel.
Click in the source.
Make changes.
Press Command-S or Ctrl-S to save changes.
Right click on the source code (or in the Sources panel sources tree) and select Local modifications to view versioning.
Right-click, select Save As..., and choose a location on disk to save the file. Subsequent saves will save to this location.
是的,在 Firefox 中,如果您还使用优秀的 Web Developer 插件...
使用该附加组件,选择查看源代码 -> 查看生成的源代码。
这将打开由 JS 和您在 Firebug 中进行的任何手动编辑修改的 HTML“文件”1 的当前状态。
从弹出的窗口中,您可以“另存为”文件,或根据需要进行复制和粘贴。
请注意,此生成的文件将具有大量 Firebug 样式(易于识别),并且可能具有由 JS 在元素上设置的
style
属性。1 不幸的是,它无法捕获链接的 CSS 或 JS 文件的更改。
因此,在使用 Firebug 进行调整时,我喜欢通过将样式规则和代码附加到 HTML“文件”来更改 CSS 和 JS。
一旦页面的外观/行为接近所需的内容,就会通过查看生成的源代码对更改进行快照,然后根据需要合并到链接的文件中。
Yes, in Firefox, if you also use the excellent Web Developer add-on...
Using that add-on, select View Source -> View Generated Source.
This will open the current state of the HTML "file"1 as modified by JS and by any hand edits you made in Firebug.
From the window that pops up, you can "save-as" the file, or copy-and-paste as desired.
Note that this generated file will have a slew of Firebug styles (easily identified) and may have
style
attributes set on elements by JS.1 Unfortunately, it doesn't capture changes to CSS or JS files that are linked in.
For this reason when tweaking with Firebug, I like to change CSS and JS by appending style rules and code to the HTML "file".
Once the page looks/acts close to what is desired, the changes are snapshotted via View Generated Source, and then merged into the linked-in files as necessary.
有一个适用于 Eclipse/Chrome 的 Java 项目:
http://code.google.com/p/chromedevtools/< /a>
它只是一个 JavaScript 调试器(您看不到 CSS 或网络等),但您可以设置 Eclipse 项目,以便调试和编辑相同的文件(以及实时编辑)。
在当前版本中设置源文件有点棘手
http://code.google.com /p/chromedevtools/wiki/FeatureDebugOnRealFiles
(希望下一个版本会更容易)。
与 JSDT 或 Aptana 或其他 JavaScript 支持一起,您可以为 Chrome 提供一个不错的 IDE+调试器。
There's a Java project for Eclipse/Chrome:
http://code.google.com/p/chromedevtools/
It is a JavaScript debugger only (you do not see CSS or network etc), but you can set up your Eclipse project so that debug and edit the same files, (plus live editing).
Setting up source files are a bit tricky in the current version
http://code.google.com/p/chromedevtools/wiki/FeatureDebugOnRealFiles
(next version hopefully is easier).
Together with JSDT or Aptana or other JavaScript support you can have a nice IDE+debugger for Chrome.
不。您正在编辑的代码是呈现的客户端代码。无法通过浏览器影响服务器端代码。无论如何,如果服务器端的底层文件是非静态的,则此类操作的语义确实会崩溃。
No. The code you're editing is the rendered client side code. There is no way to impact the server side code through the browser. In any case, the semantics of such an operation really break down if the underlying file(s) on the server side is/are non-static.