BBC:标注 data-component 块
开发者辅助:勾勒并标注每个带 data-component 属性的元素及其名称。
可复制的代码
// Developer aid: label every [data-component] block
(function () {
document.querySelectorAll('[data-component]').forEach(function (el) {
if (el.dataset.jzLabelled) { return; }
el.dataset.jzLabelled = '1';
el.style.outline = '1px solid rgba(184,0,0,0.4)';
var tag = document.createElement('span');
tag.textContent = el.getAttribute('data-component');
tag.style.cssText = 'background:#b80000;color:#fff;font:10px monospace;' +
'padding:1px 3px;display:inline-block';
el.insertBefore(tag, el.firstChild);
});
})();
如何使用此示例
- 用上方按钮复制代码。
- 安装 JustZix(2 分钟),在目标页面打开扩展。
- 添加一条匹配该页面的新规则。
- 将代码粘贴到规则的 JavaScript 面板并保存 — 每次访问页面时都会运行。
为此示例评分
暂无评分 — 成为第一个。