Javascript防止点击劫持

Question

我的应用程序中有这个Javascript片段来防止点击：

<script language="javascript" type="text/javascript">
     var style = document.createElement('style');
     style.type = "text/css";
     style.id = "antiClickjack";
     style.innerHTML = "body{display:none !important;}";
     document.head.appendChild(style);

     if (self === top) {
         var antiClickjack = document.getElementById("antiClickjack");
         antiClickjack.parentNode.removeChild(antiClickjack);
     } else {
         top.location = self.location;
     }
</script>

基本上，在默认情况下，它创建一个样式元素(CSS动态)来隐藏当前页面的主体。然后，如果它没有检测到点击劫持，它会删除它。因此，这样做，每个没有Javascript的人也可以看到这个页面(尽管他们不会受到防点击攻击的保护)。

它适用于每个浏览器，但Internet除外，后者引发未知运行时错误异常。有人对如何解决这个问题有什么建议吗？

谢谢:-)

Answer 1

您不能通过<style>设置innerHTML元素的内容。我认为正确的属性名是cssText，但是我必须检查MSDN。

编辑-对，就是这样。

因此，您的代码可以这样做：

 var style = document.createElement('style');
 style.type = "text/css";
 style.id = "antiClickjack";
 if ('cssText' in style)
   style.cssText = "body{display:none !important;}";
 else
   style.innerHTML = "body{display:none !important;}";

Answer 2

在document元素中添加以下内容：

<style id="antiClickjack">body{display:none !important;}</style>

<script type="text/javascript">
   if (self === top) {
       var antiClickjack = document.getElementById("antiClickjack");
       antiClickjack.parentNode.removeChild(antiClickjack);
   } else {
       top.location = self.location;
   }
</script>