Skip to main content

DOM FAQ

ShadowRoot rem & font-size

ShadowRoot.mode

  • open
    • 记录 element.shadowRoot
    • 受外部 style 影响
  • closed
    • 不会记录 root
    • 如有需要需要自己使用 WeakMap 跟踪引用

shadow dom 重置 host 样式

:host {
all: initial;
}

初始化 style

// 新的方式 - 2019, Chrome 73+
var sheet = new CSSStyleSheet();
sheet.replaceSync(`.color { color: pink }`);
host.shadowRoot.adoptedStyleSheets = [sheet];

// 旧的方式
let style = document.createElement('style');
style.textContent = css;
container.appendChild(style);

a 的 download 不生效

  • 如果 HTTP 有 Content-Disposition 头 则优先
  • 非 same-origin download 属性无效

可以选择预先下载 base64 然后下载

<!-- same orgin -->
<a href="/wp-content/uploads/file.mp4" download="file.mp4">
<!-- pre-download -->
<a download href="data:application/octet-stream;base64,PD94ANDSOON">Download Me</a></a
>

key vs code

keycode
aKeyA
AKeyA
1Digit1
!Digit1
-Minus
EnterEnter
ShiftShiftLeft