html - 谨慎创建外部站点代码

Question

我正在创建一个任何用户都可以在您的网站上实现的小屏幕插件。它类似于像 Zopim 和 tawk.to 这样的聊天室，用户在其中获取特定代码 javascript 并粘贴到导入框屏幕的网站上。

就我而言，我采取了一些预防措施:

• 使用 (id="____Plug___Box") 以某人不太可能的名字创建 div>
• 所有子div的css，必须先调用上一个div，再调用当前div #___Plug___Box #BoxInside

但我为什么要这样做？因为我有点担心外部 CSS 会影响我的插件。

在我的例子中，我告诉用户始终在页面底部实现我的 javascript 代码(远离那种事情)，我这样做是对的吗？还有什么我应该在我的代码中实现以防止外部 CSS 的干扰吗？

就 Zopim 而言，他似乎使用了 css-inline，这会是一件好事吗？

Answer 1

用户总是可以覆盖你的代码。但是您可以提供随机 id 前缀并从 js 端创建所有元素。使用内联 CSS 也会有所帮助。

var idPrefix = 'myPl'+(Math.rand() * 1000);

$('<div/>', {
    style: 'color: red;',
    id: idPrefix+'-wrapper',
    html: $('<span/>', {'class': idPrefix+'-header'})
});

---

我建议使用核心类进行 js 操作和支持类进行显示，可以覆盖。

<span class="myPl-js-click-for-action myPl-css-color-red">Click this red text</span>