修改 Shadow DOM 中的 CSS

Answer 1

你必须直接进入shadowRoot，获取

.controls

元素并设置内联样式

document
   .querySelector("figspec-file-viewer")
   .shadowRoot
   .querySelector(".controls")
   .style
   .display = "none";

或者在shadowRoot中添加一个

<style>

标签：

document
   .querySelector("figspec-file-viewer")
   .shadowRoot
   .append(
      Object.assign( document.createElement("STYLE") ,
                     {
                       innerHTML = `.controls {
                                       display : "none";
                                     }`
                     }
                    )// Object.assign
          )// append

正如评论中提到的，

part

可以做到。 通过上述方法，您可以在 DOM 元素

inside

ShadowDOM 上设置 part attribute，然后使用 global CSS 对其进行样式设置。