Das OffsetParent -Attribut gibt einen Verweis auf ein Objekt zurück. Wenn dieses Containerelement CSS nicht positioniert, ist der Wert der OffsetParent -Eigenschaften das Stammelement (das HTML -Element ist das HTML -Element im Standardkompatibilitätsmodus; es ist ein Körperelement im seltsamen Präsentationsmodus). Wenn der style.abidisplay des Containerelements auf "keine" festgelegt ist (mit Ausnahme: IE und Opera), gibt die OfficeParent -Immobilie NULL zurück.
Syntax:
parentObj = element.offsetParent
Variable:
・ ParentObj ist ein Hinweis auf ein Element, und der Versatz des Stromelements wird berechnet.
Kopieren Sie den Code -Code wie folgt:
<!
<html>
<kopf>
<meta http-äquiv = "content-type" content = "text /html; charset = utf-8" /> />
<titels> Ohne Titeldokument </title>
<script type = "text/javaScript" Sprache = "JavaScript">
Funktion offset_init () {
var pelement = document.getElementById ("Sonobj");
parentObj = pelement.offsetParent;
Alert (parentobj.tagname);
}
</script>
</head>
<body nur = "Office_init ()" >>
<div id = "parent">
<p id = "Sonobj"> Test -OffsetParent -Attribute </p> </p>
</div>
</body>
</html>
Testergebnisse:
Firefox3: "Körper"
Internet Exploorr 7: "Körper"
Opera 9.51: "Körper"
Chrom 0,2: "Körper"
Safari 3: "Körper
abschließend:
Wenn die Elemente und ihre Dom -Struktur -Ebenen nicht in der Dom -Struktur -Ebene (absolut oder verkleinert) durchgeführt werden [oder ein bestimmtes Element wird positioniert, wenn das Element nicht in der Dom -Struktur -Ebene durchgeführt wird, wenn die Dom -Struktur -Ebene nicht ausgeführt wird] Die OffsetParent -Eigenschaft dieses Elements Der Wert des Wertes ist das Stammelement. Genauer gesagt sind die Referenzen verschiedener Offset -Berechnungen dieses Elements (Offsettop, OffsetLeft usw.) Körperelemente. (Tatsächlich sind die Wurzelelemente unabhängig von der Zeit -Standardkompatibilitätsmodus oder dem seltsamen Modus Körperelemente.)
Testcode 2
Kopieren Sie den Code -Code wie folgt:
<!
<html>
<kopf>
<meta http-äquiv = "content-type" content = "text /html; charset = utf-8" /> />
<titels> Ohne Titeldokument </title>
<Style type = "text/css">
#PARENT {
Position: Absolut; <!-Position: Relativ;->
links: 25px;
Top: 188px;
Grenze: 1PX Solid Black;
}
</style>
<script type = "text/javaScript" Sprache = "JavaScript">
Funktion offset_init () {
var pelement = document.getElementById ("Sonobj");
parentObj = pelement.offsetParent;
Alert (parentobj.tagname);
}
</script>
</head>
<body nur = "Office_init ()" >>
<div id = "parent"> Div -Testcode
<p id = "Sonobj"> Test -OffsetParent -Attribute </p> </p>
</div>
</body>
</html>
Testergebnisse:
Firefox3: "Div"
Internet Exploorr 7: "Div"
Opera 9.51: "Div"
Chrom 0,2: "Div"
Safari 3: "Div"
abschließend:
Wenn das übergeordnete Element eines bestimmten Elements eine CSS -Positionierung ausführt, ist der Wert der OfficeParent -Eigenschaft dieses Elements das übergeordnete Element. Genauer
Testcode 3
Kopieren Sie den Code -Code wie folgt:
<!
<html>
<kopf>
<meta http-äquiv = "content-type" content = "text /html; charset = utf-8" /> />
<titels> Ohne Titeldokument </title>
<Style type = "text/css">
#GrandFather {
Position: Relativ;
links: 25px;
Top: 188px;
Grenze: 1PX Solid Black;
}
</style>
<script type = "text/javaScript" Sprache = "JavaScript">
Funktion offset_init () {
var pelement = document.getElementById ("Sonobj");
parentObj = pelement.offsetParent;
Alert (parentobj.tagname);
}
</script>
</head>
<body nur = "Office_init ()" >>
<H1 ID = "Großvater">
<div id = "parent">
<p id = "Sonobj"> Test -OffsetParent -Attribute </p> </p>
</div>
</h1>
</body>
</html>
Testergebnisse:
Firefox3: "H1"
Internet Exploorr 7: "H1"
Opera 9.51: "H1"
Chrom 0,2: "H1"
Safari 3: "H1"
abschließend:
Wenn ein bestimmtes Element und sein übergeordnetes Element keine CSS -Positionierung sind, ist der Wert der OfficeParent -Eigenschaft dieses Elements in der Dom -Struktur -Ebene am nächsten, und die CSS -Positionierung wurde durchgeführt.