防止外部源使用Javascript修改我的HTML

Question

我有这样的东西：

$('mySelector').html("this is mine now");

然后一些我无法编辑或删除的外部JS做了其他事情：

$('mySelector').on("focus", function(e){
//lots of stuff
$(this).empty();
})

元素有什么方法可以保留我之前添加的HTML吗？

Answer 1

在我看来，这不是一个应该使用的模式，但基于此，您可以为同一事件定义第二个处理程序。我不确定是否必须在现有处理程序之前或之后定义它，但结果是只触发一个处理程序。

如果它被触发，则意味着您的处理程序没有侦听与另一个相同的元素。如果是这种情况，您可以将一个新的侦听器附加到this的子dom元素，并在其中使用event.preventDefault() && event.stopPropagation()，这样外部处理程序就不会运行

Answer 2

您可以使用内容安全策略指令来阻止浏览器从外部域加载JS。

Content-Security-Policy: script-src 'self' https://example.com;

这将只允许从您自己的域和example.com.执行JS

---

因此，基本上，您可以在域级别限制访问。注意，<iframe>可以加载不同的域，该域可以具有不同的访问规则。

但除此之外，目前还没有办法指定JS脚本可以或不能访问/修改页面上的DOM元素。