我有一个显示Google可视化的（长）<script>元素。代码直接来自Google;我无法改变它。
我需要隐藏输出，直到用户点击Show。
我有两次尝试实现这一目标：
如果脚本标记在隐藏的DOM节点内处理，则在显示包含节点时无法显示。
如果脚本代码是动态插入的jQuery('#parent-element').html('<script...>');，那么它会失败，因为它需要document.write cannot run asynchronously（无法告诉在哪里要写的文件）
我需要显示/隐藏按钮的原因是因为输出以全屏覆盖显示（对于正常的内容区域来说太大了）。
我想要一个通用的解决方案，以便我的客户可以嵌入其他＆＃34;魔法＆＃34;外部SAAS（google，youtube，...）提供的html块
答案 0 :(得分：1)
而不是display:none使用不可见的元素（visibility:hidden）。
display:none表示该元素不会呈现为DOM的一部分
在display属性更改为其他内容之前，它不会加载。
visibility:hidden加载元素，但不显示它。
答案 1 :(得分：0)
我通过绝对定位<script>的父元素并远离视口（css：position:absolute; left:-10000px;）解决了这个问题。
然后我将fixed叠加层完全分开（即兄弟姐妹），默认隐藏。
在节目中，叠加层为fadeIn()，在淡入淡出完成后，屏幕外元素设置为position:fixed; left: 24px; top: 24px;。
重新隐藏时，屏幕会重置内容，并使用fadeOut()隐藏叠加层。
叠加层需要比内容更低的z-index。