Question

我有一个用纯JS编写的chrome扩展，它基本上由将数据附加到页面上的链接的函数组成。

基本上只是将一个单击整数附加到从另一个函数传入的链接元素的函数示例：

function addCounttoLinks(link, counts) {
    var clicks = counts.split(":")[1].split(",")[0].trim();
    var count = document.createTextNode((" (" + clicks + ")"));
    var dspan = document.createElement("span");
    dspan.appendChild(count);
    dspan.style.fontSize = "10px"; dspan.style.textAlign = "center";
    link.appendChild(dspan); 
}

执行/取消执行这些功能的最有效方法是什么，这样我就可以实现一个“开/关”按钮供用户点击，这将添加/删除扩展所附加的数据。是编写函数来删除以前创建的元素的唯一解决方案吗？

Answer 1

在span上放一个课程（比如，my-nifty-extension-extra - 您希望它不太可能与其他内容发生冲突），然后将课程添加到body（例如{ {1}}）隐藏数据时，在显示数据时将其删除。然后使用此样式规则：

hide-my-nifty-extension

例如，就在body.hide-my-nifty-extension span.my-nifty-extension-extra { display: none; }：

之前

appendChild

然后：

dspan.className = "my-nifty-extension-extra";

（撰写Chrome扩展程序的一个好处是，您知道自己拥有function showExtraData() { document.body.classList.remove('hide-my-nifty-extension'); } function hideExtraData() { document.body.classList.add('hide-my-nifty-extension'); }等内容。）

通过onclick添加/删除元素

1 个答案: