استكشاف jQuery - طريقة contents()

مثال

يجد جميع عناصر النص في الفقرة ويحاط بها بعلامة <b>بشكل جريء.

$("p").contents().filter(function(){ return this.nodeType != 1; }).wrap("<b/>");

تجربة بنفسك

التعريف والاستخدام

يحصل طريقة contents() على أبناء كل عنصر في مجموعة العناصر التي تتطابق معها، بما في ذلك عناصر النص والتعليقات.

النحو

.contents()

شرح مفصل

إذا كان الموضوع المحدد هو مجموعة العناصر DOM باستخدام jQuery، يسمح لنا طريقة .contents() باسترجاع الأبناء المباشرين لهذه العناصر في شجرة DOM، واستخدام العناصر التي تتطابق مع العناصر الجديدة لإنشاء jQuery. .contents() و .children() الطريقة مشابهة، ولكن يختلف الأمر في أن الطريقة الأولى تحتوي على عناصر النص والهيكلية في jQuery.

.contents() يمكن استخدامها أيضًا للحصول على وثيقة محتوى iframe، شريطة أن يكون iframe في نفس المجال كما الصفحة الرئيسية.

فكر في هذا <div> الذي يحتوي على بعض عناصر النص، وكل عنصر منفصل بكتلة منقوسة (<br/>)

<div class="container">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed 
  do eiusmod tempor incididunt ut labore et dolore magna aliqua. 
  <br /><br />
  Ut enim ad minim veniam, quis nostrud exercitation ullamco 
  laboris nisi ut aliquip ex ea commodo consequat.
  <br /> <br />
  Duis aute irure dolor in reprehenderit in voluptate velit 
  esse cillum dolore eu fugiat nulla pariatur.
</div>

يمكننا استخدام طريقة .contents() لتحويل قطع النص إلى فقرات جيدة الشكل:

$('.container').contents().filter(function() {
  return this.nodeType == 3;
)
  .wrap('<p></p>')
.end()
.filter('br')
  .remove();

تجربة بنفسك

هذا الكود سيتلقي محتويات <div class="container"> أولاً، ثم سيفصل عن عناصر النص، ويقوم بإنشاء علامات فقرة حولها. يتم هذا من خلال اختبار خاصية .nodeType للعنصر. تحتوي هذه الخاصية على رمز رقمي يوضح نوع العنصر؛ يستخدم رمز 3 للعناصر النصية. سيتم تصفية المحتوى مرة أخرى، هذه المرة ضد عناصر <br />، والتي سيتم إزالتها.