默认情况下,在Firefox 63中启用了Shadow DOM和 Web Components ,开发人员 工具 已为它们做好准备了! 如果您在项目中使用Web Components,或想要试验,请 下载Nightly ,并查看我们如何将这些新技术集成到Inspector和Debugger中
现在可以检查<template>元素,它们可用于创建自定义元素的内部Shadow DOM结构,就像检查其他类型的节点一样。
还可以检查元素内的 Shadow DOM 。 在Inspector中查找#shadow-root节点 - 并注意它也是用它创建的模式(关闭或打开)。
如果您的Shadow DOM包含插槽,您也可以检查它们!
作为一个很好的奖励,如果你点击一个开槽节点上的箭头图标,你将跳转到原始节点的位置:
说到跳跃,如果你想从Inspector中的自定义元素跳转到调试器中的定义,你可以通过点击元素旁边的自定义徽章来实现:
最后,您可以在Inspector右侧的CSS窗格中查看CSS级联如何影响Shadow DOM,修改样式,检查布局等。
我们希望能帮助您完成Web组件的工作。 与往常一样,我们正在努力改进开发人员工具 - 您可以 查看接下来会发生什么 。 如果您发现了错误,或者有一些建议或反馈,我们非常欢迎您在 DevTools的Slack社区或IRC频道 中分享它们。
快乐的编码!
Linux公社的RSS地址: https://www.linuxidc.com/rssFeed.aspx
本文永久更新链接地址: https://www.linuxidc.com/Linux/2018-09/153961.htm
以上所述就是小编给大家介绍的《Firefox 63中的Web Components支持开发人员工具》,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对 码农网 的支持!
猜你喜欢:- 不满支持论坛,安全人员连续公布三个 WordPress 插件漏洞
- Linux 内核开发人员正在讨论删除对 x32 的支持
- 测试人员和开发人员可以互相学习什么?
- 对安全研究人员和渗透测试人员有用的Firefox 插件
- 编码人员,程序员,开发人员和软件工程师之间的差异
- Achronix为研究人员和测试芯片开发人员推出全新"eFPGA Accelerator"eFPGA应用加速项目
本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们。
Ajax Design Patterns
Michael Mahemoff / O'Reilly Media / 2006-06-29 / USD 44.99
Ajax, or Asynchronous JavaScript and XML, exploded onto the scene in the spring of 2005 and remains the hottest story among web developers. With its rich combination of technologies, Ajax provides a s......一起来看看 《Ajax Design Patterns》 这本书的介绍吧!