3

序章

elem.hidden要素を非表示にし、それらが非表示かどうかを検出できる新しいプロパティです。

ブラウザのサポートは良くないので、シムしたいと思います。このプロパティをシムする場合、 を介して CSS プロパティを設定するという点でシムする必要がありますelem.style。

Shim の単純な実装

Object.defineProperty(HTMLElement.prototype, "hidden", {
  get: function get() {
    return this.style.<???>;
  },
  set: function set(v) {
    this.style.<???> = v ? <???> : <???>
  },
  configurable: true
});

質問

  • またはに設定elem.style.displayする必要があります"none"か<original value>？
  • またはに設定elem.style.visibilityする必要があります"hidden"か"visible"？
4

2 に答える 2

3

ブラウザは隠し属性を次のように実装する必要があります。[hidden] { display:none }

Force browser to ignore HTML 5 featuresに対する Boris Zbarsky の回答と、その後のコメントを参照してください。

これはユーザー エージェント スタイル シートを介して行われるため、特定性が非常に低く、hidden 属性に言及していないものであっても、より特定的なスタイルによって簡単に上書きされることに注意してください。

これは隠し属性の実装方法としてはひどいと思いますが、それがルールです。その動作に到達できる最も近い[hidden] { display:none }方法は、要素のスタイル プロパティに直接適用するのではなく、HTML ページの最初のスタイルシートの開始点にできるだけ近づけることです。

要素のプロパティに関しては、HTML5 仕様では「非表示の IDL 属性は、同じ名前のコンテンツ属性を反映する必要があります」と記載されているため、Object.defineProperty を使用して追加する必要があるのはそれだけです。ただし、Object.defineProperty はあまり広くサポートされていないという kennebec のコメントはおそらく有効です。

于 2012-01-26T17:26:49.250 に答える
1

visibility: hidden要素は画面上のスペースを占有するため、引き続きレンダリングする必要があります。要素はレンダリングに関して無視される可能性があり、無視されるため、display: noneより近いです。.hidden = truedisplay: none

于 2012-01-26T17:15:17.907 に答える