使用 CSS 隐藏脚本创建的 div答案

【问题标题】：Hide div created by script with CSS使用 CSS 隐藏脚本创建的 div
【发布时间】：2017-12-13 14:15:31
【问题描述】：

以下代码在顶部面板中创建一个带有链接的 html 聊天框，该链接具有多个子 div。
div id=cgroup； div id=CBG； div id=CGW； div id=头。其中 cgroup 是 CBG 的父级，它是 CGW 的父级，CGW 是我要隐藏的 div 的父级。
如何使用 css 为子 div id=HEAD 专门“显示 = none”？

<script id="cid0020000101807397328" data-cfasync="false" async src="//st.chatango.com/js/gz/emb.js" style="width: 603px;height: 471px;">
{"handle":"1shotgg","arch":"js","styles":{"a":"000000","b":100,"c":"a0a0a0","d":"FFFFFF","e":"202020","g":"bbbbbb","h":"202020","j":"c0c0c0","k":"0084ef","l":"606060","m":"0084ef","n":"FFFFFF","p":"10","q":"000000","r":100,"pos":"br","cv":1,"cvfntsz":"14px","cvbg":"3366ff","cvw":600,"cvh":30,"surl":0,"allowpm":0,"cnrs":"0.35","ticker":1,"fwtickm":1}}</script>

【问题讨论】：

标签： javascript jquery html css embed

【解决方案1】：

假设这会将聊天框加载到 <iframe> 中，那么您无能为力来影响加载到<iframe>.

应用于父页面的任何 CSS 都将不适用于框架内的页面。同样，如果您尝试使用 JavaScript 更改框架内的文档，您可能会遇到安全异常 — 浏览器的 Same Origin Policy 将阻止您的 JavaScript 代码访问从 加载的页面不同的域：

要了解更多信息，请参考这个问题：
Ways to circumvent the same-origin policy

那么解决办法是什么？

您应该尝试查看聊天框插件是否提供了您正在寻找的自定义类型作为配置选项或类似的东西。

【讨论】：

【解决方案2】：

假设您的脚本创建了一个结构为<div id="head"> 的元素，您可以使用以下语法直接定位它：

#head {
  display: none;
}

尽管您永远不应该在同一页面上有两个具有相同 ID 的元素，但您可以确保这仅隐藏目标<div>更具体一点并使用> direct child selector：

#cgroup > #CBG > #CGW > #head {
  display: none;
}

以上将仅以ID 为<head> 的<div> 为目标，其中父ID 为CGW，父ID 为CBG ，并且其父 ID 为 cgroup。

希望这会有所帮助！ :)

【讨论】：

我认为在发布此问题之前会很简单，因为该脚本确实创建了我想要隐藏的子 div HEAD。不幸的是，这不是决议。认为它可能区分大小写，我也尝试了标记 #HEAD 无济于事。
您是否在<iframe> 中运行脚本？如果是这样，由于Cross-Origin Resource Sharing，不可能从另一个网站设置代码样式。在这种情况下，您可能会发现聊天框提供了一些自定义选项。