使用JavaScript将div隐藏在（例如Twitter）阴影dom中

使用TamperMonkey简化我这边的页面视图，并希望隐藏部分外部来源的Twitter卡，以防打印。EmbeddedTweet中的图像无论如何都不会打印，并且会留下一个大的空矩形，浪费宝贵的空间

DOM如下图所示-如何使用class

SummaryCard image

（绿色箭头）将DIV作为目标？DIV是从DOM中删除，还是仅仅用CSS隐藏，对我来说都无关紧要

我尝试过以下方法，但不起作用：

（1） 向CSS注入

.SummaryCard图像{显示：无！重要；}

（2） jQuery:

$（'.SummaryCard image'）.remove（）

$（“.SummaryCard image”）.length
返回
0

（注意
#阴影根（打开）
，从顶部开始的第二个元素）

为了遍历到该元素，需要首先选择阴影根。你需要这样的东西

var twitterWidget= document.querySelector('twitterwidget').shadowRoot;
twitterWidget.querySelector('.SummaryCard-image').style.display = "none";

用于多个twitter小部件

    var twitterWidgets = document.querySelectorAll('twitterwidget'); 

    twitterWidgets.forEach(function(item){
      var root = item.shadowRoot; root.querySelector('.SummaryCard-image').style.display = 'none';
    })

范例

然后需要使用querySelectorAll。querySelectorAll返回节点列表。您需要迭代它。没问题。：-）像老板一样工作-谢谢你，卡迪。对于未来的谷歌：对于Twitter，还需要添加一个单独的forEach循环来捕获
root.querySelector（'article'）。style.display='none'
var tabs= document.querySelector('fancy-tabs').shadowRoot
tabs.querySelector('#tabs').style.display = none