HTMLElement: inert-Eigenschaft
Baseline
Widely available
*
This feature is well established and works across many devices and browser versions. It’s been available across browsers since April 2023.
* Some parts of this feature may have varying levels of support.
Die HTMLElement-Eigenschaft inert spiegelt den Wert des inert-Attributs des Elements wider. Es handelt sich um einen booleschen Wert, der, wenn er vorhanden ist, bewirkt, dass der Browser Benutzereingabeereignisse für das Element "ignoriert", einschließlich Fokuserereignisse und Ereignisse von unterstützenden Technologien. Der Browser kann auch die Seitensuche und die Textauswahl im Element ignorieren. Dies kann nützlich sein, wenn Sie Benutzeroberflächen wie Modals erstellen, bei denen Sie den Fokus im sichtbaren Modal "einfangen" möchten.
Beachten Sie, dass wenn das inert-Attribut nicht angegeben ist, das Element selbst möglicherweise dennoch Trägheit von seinem Elternteil erbt. Diese ererbte Trägheit wird jedoch nicht durch den Wert dieser Eigenschaft widergespiegelt. Die explizite Setzung der Eigenschaft auf false kann die von den Eltern geerbte Trägheit nicht rückgängig machen.
Wert
Ein boolescher Wert, der true ist, wenn das Element inert ist; andernfalls ist der Wert false.
Beispiele
HTML
<div>
<label for="button1">Button 1</label>
<button id="button1">I am not inert</button>
</div>
<div inert>
<label for="button2">Button 2</label>
<button id="button2">I am inert</button>
</div>
CSS
[inert] > * {
opacity: 0.5;
}
Hinweis: Dieses Attribut alleine wird keine visuelle Änderung des Inhalts bewirken, wie er im Browser angezeigt wird. Im obigen Beispiel wurde CSS angewendet, sodass jeder direkte Nachfahre eines Elements mit dem inert-Attribut halbtransparent dargestellt wird.
Spezifikationen
| Specification |
|---|
| HTML # dom-inert |
Browser-Kompatibilität
Loading…
Siehe auch
- Globales Attribut:
inert disabled<dialog>- CSS
interactivity-Eigenschaft