Thuộc tính offsetParent trong HTML DOM

Thuộc tính offsetParent trong HTML DOM trả về phần tử cha được tham chiếu, từ đó các offset của phần tử con được xác định.

Cú pháp

HTMLelement.offsetParent

Ví dụ

Dưới đây là ví dụ minh họa thuộc tính offsetParent:

<!DOCTYPE html>
<html>
<head>
  <title>HTML DOM offsetParent</title>
  <style type="text/css">
    #picForm { width: 70%; margin: 0 auto; text-align: center; }
    input[type="button"] { border-radius: 10px; }
    #containerDiv { margin: 0 auto; }
  </style>
</head>
<body>
  <form id="picForm">
    <fieldset>
      <legend>HTML-DOM-offsetParent</legend>
      <div id="containerDiv">
        <img id="image" src="https://www.tutorialspoint.com/plsql/images/plsql-mini-logo.jpg">
      </div>
      <input type="button" onclick="getParent()" value="Lấy offsetParent">
      <div id="divDisplay"></div>
    </fieldset>
  </form>
  <script>
    var divDisplay = document.getElementById("divDisplay");
    var picForm = document.getElementById("picForm");
    var containerDiv = document.getElementById("containerDiv");
    function getParent() {
      divDisplay.textContent = 'Offset cho form hình ảnh được tham chiếu từ: ' + picForm.offsetParent;
    }
  </script>
</body>
</html>

Kết quả

Trước khi nhấn bất kỳ nút nào:

Sau khi nhấn nút 'Lấy offsetParent':