Javascript 如何将动态设置的HTML的CSS封装在一个div中，从而不影响外部元素？

我的情况是，用户可以将任何HTML粘贴到文本框中。然后我必须处理HTML，例如，找出所有的锚定标记或div等等

为了解决这个问题，我制作了一个隐藏的div，并将该div的html设置为与粘贴的html相同

var pastedHtml = $("#textbox-id").val();
$("#hiddendiv").html(pastedHtml);

完成后，我就可以作为DOM元素完全访问粘贴的HTML文档，并可以使用jQuery或Javascript轻松地对其进行操作

现在我面临的问题是，当我将HTML设置到隐藏的div中时，如果存在与母页相同的类、id或任何其他选择器，我的母页就会受到影响

因此，我试图以某种方式将CSS样式封装在粘贴的HTML中，这样它就不会影响外部页面

粘贴的HTML可以包含内联样式，我认为这不是一个问题，可以在标记内部设置样式，甚至可以从文件外部链接。事实上，它可以是任何东西

有没有图书馆或其他东西可以做这件事？或者我应该用什么方法来解决这个问题

任何帮助都会对我很好

如果需要更多数据，请告诉我

---

提前谢谢

使用iframe。在这种情况下，内容将与主文档完全隔离

同时使用htmlparsedHTML对我来说使用起来相当不安全

---

Janis使用iframe。在这种情况下，内容将与主文档完全隔离

同时使用htmlparsedHTML对我来说使用起来相当不安全

---

Janis

如果您可以控制CSS的分配，那么在为内部元素分配CSS时，只需使用隐藏div的id即可

因此，它们通常具有更高的特异性，并覆盖类似的规则

示例堆栈代码段

希登迪夫1组{ 颜色：红色； } 希登迪夫蓝{ 颜色：蓝色； } 嘿，我是红色的，我是蓝色的

---

如果您可以控制CSS的分配，那么在为内部元素分配CSS时，只需使用隐藏div的id即可

因此，它们通常具有更高的特异性，并覆盖类似的规则

示例堆栈代码段

希登迪夫1组{ 颜色：红色； } 希登迪夫蓝{ 颜色：蓝色； } 嘿，我是红色的，我是蓝色的

---

为隐藏的div元素设置一个id。然后将该id用于选择器，从具有该id的元素中选择其中的任何元素。这是什么？这不是我的问题，请看一看问题。如果你担心CSS影响你的母元素，你也担心动态插入的JS吗？i、 e$textbox-id.hideeyes，你是对的，没有想到这一点@在这种情况下，@jancha使用iframe的解决方案是将id设置为隐藏的div元素的最安全的方法。然后将该id用于选择器，从具有该id的元素中选择其中的任何元素。这是什么？这不是我的问题，请看一看问题。如果你担心CSS影响你的母元素，你也担心动态插入的JS吗？i、 e$textbox-id.hideeyes，你是对的，没有想到这一点@在这种情况下，@jancha使用iframe的解决方案是最安全的方法