Dieser Inhalt wurde automatisch aus dem Englischen übersetzt, und kann Fehler enthalten. Erfahre mehr über dieses Experiment.
LayoutShift: toJSON()-Methode
Eingeschränkt verfügbar
Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.
Want more support for this feature? Tell us why.
Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.
Die toJSON()-Methode des LayoutShift-Interfaces ist ein Serializer; sie gibt eine JSON-Darstellung des LayoutShift-Objekts zurück.
Syntax
toJSON()
Parameter
Keine.
Rückgabewert
Ein JSON-Objekt, das die Serialisierung des LayoutShift-Objekts ist.
Beispiele
Verwendung der toJSON-Methode
In diesem Beispiel gibt der Aufruf von entry.toJSON() eine JSON-Darstellung des LayoutShift-Objekts zurück.
const observer = new PerformanceObserver((list) => {
list.getEntries().forEach((entry) => {
console.log(entry.toJSON());
});
});
observer.observe({ type: "layout-shift", buffered: true });
Dies würde ein JSON-Objekt wie folgt protokollieren:
{
"name": "",
"entryType": "layout-shift",
"startTime": 246.39999999850988,
"duration": 0,
"value": 0.0071167845054842215,
"hadRecentInput": false,
"lastInputTime": 0,
"sources": [
{
"previousRect": {
"x": 917,
"y": 708,
"width": 706,
"height": 248,
"top": 708,
"right": 1623,
"bottom": 956,
"left": 917
},
"currentRect": {
"x": 693,
"y": 708,
"width": 1154,
"height": 472,
"top": 708,
"right": 1847,
"bottom": 1180,
"left": 693
}
}
]
}
Um einen JSON-String zu erhalten, können Sie direkt JSON.stringify(entry) verwenden; diese Methode ruft automatisch toJSON() auf.
Spezifikationen
| Spezifikation |
|---|
| Layout Instability API # dom-layoutshift-tojson |
Browser-Kompatibilität
JavaScript aktivieren, um diese Browser-Kompatibilitätstabelle anzuzeigen.