jQuery ਪਰਿਭਾਸ਼ਾ - find() ਮੈਥਡ

ਉਦਾਹਰਣ

ਸਾਰੇ ਪੈਰਾਗ੍ਰਾਫਾਂ ਵਿੱਚ ਸ਼ਾਮਲ ਸ਼ਾਮਲ span ਇਲੈਕਟਰਨ ਨੂੰ ਰੰਗ ਵਿੱਚ ਲਾਲ ਬਣਾਉਣਾ ਅਤੇ ਖੋਜਣਾ:

$("p").find("span").css('color','red');

ਖੁਦ ਸਿੱਧੇ ਕਰੋ

ਪਰਿਭਾਸ਼ਾ ਅਤੇ ਵਰਤੋਂ

find() ਮੈਥਡ ਮੌਜੂਦਾ ਇਲੈਕਟਰਨ ਸਮੂਹ ਦੇ ਹਰ ਇਲੈਕਟਰਨ ਦੇ ਪਿੰਦੇ ਨੂੰ ਪ੍ਰਾਪਤ ਕਰਦਾ ਹੈ ਅਤੇ ਚੋਣਕਾਰ, jQuery ਜੁਆਇਨਸਟਰਿੰਗ ਜਾਂ ਇਲੈਕਟਰਨ ਦੇ ਮਾਧਿਅਮ ਨਾਲ ਫਿਲਟਰ ਕਰਦਾ ਹੈ。

ਸਿਧਾਂਤ

.find(selector)
ਪੈਰਾਮੀਟਰ ਵਰਣਨ
selector ਸਟਰਿੰਗ ਮੁੱਲ ਜੋ ਮੌਜੂਦਾ ਇਲੈਕਟਰਨ ਸਮੂਹ ਨੂੰ ਚੋਣਣ ਲਈ ਵਰਤਿਆ ਜਾਵੇਗਾ

ਵਿਸਤ੍ਰਿਤ ਵਰਣਨ

ਜੇਕਰ ਇੱਕ DOM ਇਲੈਕਟਰਨ ਸਮੂਹ ਦਾ ਜੁਆਇਨਸਟਰਿੰਗ ਮਿਲਿਆ ਹੈ ਤਾਂ .find() ਮੈਥਡ ਸਾਡੇ ਨੂੰ DOM ਟ੍ਰੀ ਵਿੱਚ ਇਨ੍ਹਾਂ ਇਲੈਕਟਰਨਾਂ ਦੇ ਪਿੰਦੇ ਖੋਜਣ ਦੀ ਆਗਿਆ ਦਿੰਦਾ ਹੈ ਅਤੇ ਮੈਚ ਕਰਨ ਵਾਲੇ ਇਲੈਕਟਰਨਾਂ ਨਾਲ ਇੱਕ ਨਵਾਂ jQuery ਜੁਆਇਨਸਟਰਿੰਗ ਬਣਾਉਂਦਾ ਹੈ।.find() ਅਤੇ .children() ਮੈਥਡਾਂ ਵਿੱਚ ਮਿਲਣ ਵਾਲਾ ਹੈ ਪਰ ਬਾਅਦਵਾਰਤ ਇਹ ਇਲੈਕਟਰਨ ਟ੍ਰੀ ਵਿੱਚ ਇੱਕ ਹੀ ਪੱਧਰ ਤੱਕ ਹੀ ਚੱਲਦਾ ਹੈ。

.find() ਮੈਥਡ ਦਾ ਪਹਿਲਾ ਵਿਸ਼ੇਸ਼ਤਾ ਇਹ ਹੈ ਕਿ ਉਹ ਚੋਣਕਾਰ ਐਕਸਪ੍ਰੈਸ਼ਨ ਸਾਡੇ ਨੂੰ $() ਫੰਕਸ਼ਨ ਨੂੰ ਪਾਸ ਕੀਤੇ ਹੋਏ ਐਕਸਪ੍ਰੈਸ਼ਨ ਦੇ ਇੱਕ ਸਮਾਨ ਹੈ। ਇਹ ਐਕਸਪ੍ਰੈਸ਼ਨ ਨਾਲ ਮੈਚ ਕਰਨ ਵਾਲੇ ਇਲੈਕਟਰਨ ਨੂੰ ਫਿਲਟਰ ਕਰਨ ਲਈ ਵਰਤਿਆ ਜਾਵੇਗਾ。

ਸਾਨੂੰ ਹੇਠਾਂ ਦਿੱਤੀ ਸਰਲ ਨਾਨਕਿਸ਼ਤ ਸੂਚੀ ਨੂੰ ਸੋਚੋ:

<ul class="level-1">
  <li class="item-i">I</li>
  <li class="item-ii">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>

ਅਸੀਂ ਸੂਚੀ II ਤੋਂ ਸ਼ੁਰੂ ਕਰਕੇ ਉਸ ਵਿੱਚੋਂ ਸੂਚੀ ਅਣੂ ਲੱਭਣਾ ਚਾਹੁੰਦੇ ਹਾਂ:

$('li.item-ii').find('li').css('background-color', 'red');

ਖੁਦ ਸਿੱਧੇ ਕਰੋ

ਇਸ ਸਰਵੇਖਣ ਦਾ ਨਤੀਜਾ ਹੈ ਕਿ ਪ੍ਰੋਜੈਕਟ A, B, 1, 2, 3 ਅਤੇ C ਸਾਰੇ ਨੂੰ ਲਾਲ ਪਿੰਡ ਦਿੱਤਾ ਗਿਆ ਹੈ। ਹਾਲਾਂਕਿ ਪ੍ਰੋਜੈਕਟ II ਚੋਣਕਾਰ ਐਕਸਪ੍ਰੈਸ਼ਨ ਨਾਲ ਮੇਲ ਖਾਂਦਾ ਹੈ, ਉਹ ਨਹੀਂ ਸ਼ਾਮਲ ਕੀਤਾ ਜਾਵੇਗਾ; ਸਿਰਫ਼ ਉਪਦੇਸ਼ਕਾਂ ਲਈ ਮੇਲ ਖਾਂਦਾ ਹੈ。

ਹੋਰ ਕਿਸੇ ਬੁਨਿਆਦੀ ਵੈਗਿਆਨਕ ਮੱਥੌਡ ਦੇ ਵਿਰੁੱਧ, ਚੋਣਕਾਰ ਐਕਸਪ੍ਰੈਸ਼ਨ .find() ਲਈ ਲਾਜ਼ਮੀ ਪੈਰਾਮੀਟਰ ਹੈ। ਜੇਕਰ ਅਸੀਂ ਸਾਰੇ ਉਪਦੇਸ਼ਕ ਐਲੀਮੈਂਟਾਂ ਨੂੰ ਵਾਪਸ ਲੈਣਾ ਚਾਹੁੰਦੇ ਹਾਂ, ਤਾਂ ਅਸੀਂ ਅਸ਼ੀਸ਼ ਚੋਣਕਾਰ '*' ਪਾਸ ਕਰ ਸਕਦੇ ਹਾਂ。

ਚੋਣਕਾਰ context ਦੂਜੇ .find() ਮੱਥੌਡ ਦੁਆਰਾ ਲਾਗੂ ਕੀਤਾ ਜਾਂਦਾ ਹੈ; ਇਸ ਲਈ $('li.item-ii').find('li') ਇੱਕੋ ਜਿਹਾ ਹੈ ਜਿਵੇਂ $('li', 'li.item-ii')。

ਜੀਐਨਕਿਊ ਐੱਲੀਮੈਂਟ 1.6 ਲਈ, ਅਸੀਂ ਦਿੱਤੇ ਗਏ ਜੀਐਨਕਿਊ ਕਲੈਸਟਰਲ ਜਾਂ ਐਲੀਮੈਂਟ ਨੂੰ ਫਿਲਟਰ ਕਰ ਸਕਦੇ ਹਾਂ। ਹੁਣ ਦੀ ਗੱਲ ਇਸੇ ਸ਼ਾਮਲ ਸ਼ਾਮਲ ਸ਼ਾਮਲ ਸ਼ਾਮਲ ਸ਼ਾਮਲ ਸ਼ਾਮਲ ਸ਼ਾਮਲ ਹੈ, ਅਸੀਂ ਇਸ ਤਰ੍ਹਾਂ ਲਿਖਾਂਗੇ:

var $allListElements = $('li');

ਤਦ ਇਹ jQuery ਆਬਜੈਕਟ find ਮੱਥੌਡ ਨੂੰ ਪਾਸ ਕਰੋ:

$('li.item-ii').find( $allListElements );

ਖੁਦ ਸਿੱਧੇ ਕਰੋ

ਉੱਪਰ ਦਾ ਕੋਡ ਇੱਕ jQuery ਕਲੈਸਟਰਲ ਵਾਪਸ ਦੇਵੇਗਾ ਜਿਸ ਵਿੱਚ ਸੂਚੀ II ਦੇ ਉਪਦੇਸ਼ਕ ਐਲੀਮੈਂਟ ਸ਼ਾਮਲ ਹੋਣਗੇ。

ਇਸੇ ਤਰ੍ਹਾਂ, ਇੱਕ ਐਲੀਮੈਂਟ ਵੀ ਪਾਸ ਕੀਤਾ ਜਾ ਸਕਦਾ ਹੈ:

var item1 = $('li.item-1')[0];
$('li.item-ii').find( item1 ).css('background-color', 'red');

ਖੁਦ ਸਿੱਧੇ ਕਰੋ

ਇਸ ਸਮੇਂ ਦੀ ਬੁਲਾਰਿਆਂ ਨਤੀਜੇ ਹੈ ਕਿ ਪ੍ਰੋਜੈਕਟ 1 ਨੂੰ ਲਾਲ ਪਿੰਡ ਦਿੱਤਾ ਗਿਆ ਹੈ。