జాన్యూటి వ్యవిచారణ - offsetParent() పద్ధతి

ఉదాహరణ

క్లాస్ పేరు item-a కలిగిన li అంశం యొక్క సమీప గుర్తించిన తల్లి అంశం యొక్క బ్యాక్‌గ్రౌండ్ కలర్ ను అమర్చుతుంది:

$('li.item-a').offsetParent().css('background-color', 'red');

స్వయంగా ప్రయత్నించండి

నిర్వచనం మరియు వినియోగం

offsetParent() సమీప గుర్తించిన ప్రాంతాన్ని పొందుతుంది.

సంక్షిప్త పద్ధతి

.offsetParent()

వివరణ

ఒక డాక్యుమెంట్ అంశాల సమూహాన్ని ప్రతినిధీకరించే జాన్యూటి అంశాన్ని ఇచ్చినట్లయితే, .offsetParent() పద్ధతి డాక్యుమెంట్ ముఖ్యమైన ప్రాంతాన్ని అన్వేషించడానికి మరియు సమీప గుర్తించిన ప్రాంతాన్ని చుట్టివచ్చే జాన్యూటి అంశాన్ని సృష్టించగలదు. గుర్తించిన అంశం అనేది, అంశం యొక్క CSS position స్వరూపం relative, absolute లేదా fixed గా ఉండేది. అనివార్యమైన అనిమేషన్ కాల్క్యులేషన్ లేదా పేజీపై అంశాన్ని స్థానించడం చేయడం విధంగా, ఈ సమాచారం మంచిది.

బేసిక్ నిలకడించిన జాబితాలను కలిగిన పేజీని ఆలోచించండి, దానిలో గుర్తించిన అంశాలు ఉన్నాయి:

<ul class="level-1">
  <li class="item-i">I</li>
  <li class="item-ii" style="position: relative;">II
    <ul class="level-2">
      <li class="item-a">A</li>
      <li class="item-b">B
        <ul class="level-3">
          <li class="item-1">1</li>
          <li class="item-2">2</li>
          <li class="item-3">3</li>
        </ul>
      </li>
      <li class="item-c">C</li>
    </ul>
  </li>
  <li class="item-iii">III</li>
</ul>

మేము ప్రాజెక్ట్ A నుండి ప్రారంభించినట్లయితే, మామూలు గుర్తించిన తల్లి అంశాన్ని గుర్తించవచ్చు:

$('li.item-a').offsetParent().css('background-color', 'red');

స్వయంగా ప్రయత్నించండి

ఇది గుర్తించిన ప్రాజెక్ట్ II యొక్క బ్యాక్‌గ్రౌండ్ కలర్ ను మారుస్తుంది.