۲۸
اردیبهشت

جلسه ۳۲ : آموزش کار با لیست گره ها در DOM

دسته‌بندی‌ها :

جزئیات
نوع محتوا آموزشی

فهرست

مقدمه

با سلام خدمت کاربران گرامی سایت پی وی لرن و علاقمندان و کاربرانی که علاقمند به یادگیری دوره XML هستند. در جلسه گذشته کار با اطلاعات گره در DOM آشنا شدید و کار با آن را فراگرفتید. در ادامه فصل آموزش DOM، آموزش کار با لیست گره ها در DOM را ارائه می نماییم.

آموزش کار با لیست گره ها در DOM

لیستی از گره ها را می توان با روش ()getElementsByTagName و ویژگی childNodes باز می شود.

لیست DOM Node

هنگامی که از ویژگی و یا یا روش هایی مانند childNodes یا ()getElementsByTagName استفاده می کنیم؛ یک node list object بازگردانی می شود.
در واقع node list object یک لیست از گره ها را به همان شیوه و سبک XML به نمایش می گذارد.
گره ها در node list از طریق ایندکس هایی از اعداد که از ۰ شروع می شوند قابل دسترس اند.
تصویر زیر نشان دهنده یک لیست گره از عناصر <title> در books.xml است:

مثال : ooks.xml

<bookstore> 
   <book category="cooking"> 
       <title lang="en">Everyday Italian</title> 
       <author>Giada De Laurentiis</author> 
       <year>2005</year> 
       <price>30.00</price> </book> 
   <book category="children"> 
       <title lang="en">Harry Potter</title> 
       <author>J K. Rowling</author> 
       <year>2005</year> 
       <price>29.99</price> </book> 
   <book category="web"> 
       <title lang="en">XQuery Kick Start</title> 
       <author>James McGovern</author> 
       <author>Per Bothner</author> 
       <author>Kurt Cagle</author> 
       <author>James Linn</author> 
       <author>Vaidyanathan Nagarajan</author> 
       <year>2003</year> 
       <price>49.99</price> </book> 
   <book category="web" cover="paperback"> 
       <title lang="en">Learning XML</title> 
       <author>Erik T. Ray</author> 
       <year>2003</year> 
       <price>39.95</price> </book> 
</bookstore>

<title lang="en">Everyday Italian</title>

<author>Giada De Laurentiis</author>

<title lang="en">Harry Potter</title>

<author>J K. Rowling</author>

<title lang="en">XQuery Kick Start</title>

<author>James McGovern</author>

<author>Per Bothner</author>

<author>Kurt Cagle</author>

<author>James Linn</author>

<author>Vaidyanathan Nagarajan</author>

<title lang="en">Learning XML</title>

</bookstore>

nodelist

فرض کنید “books.xml” در متغیر xmlDoc بارگذاری شده است.
این قطعه کد یک لیست گره از عناصر عنوان را در “books.xml” باز گردانی می کند:

مثال :

x = xmlDoc.getElementsByTagName("title");

1	x = xmlDoc.getElementsByTagName("title");

پس از اجرای statement بالا، x d یک node list object محسوب می شود.
قطعه کد زیر یک متن از اولین عنصر <title> در لیست گره (x) را بازگردانی می کند.

مثال :

var txt = x[0].childNodes[0].nodeValue;

1	var txt = x[0].childNodes[0].nodeValue;

بعد از اجرای statement بالا نوبت به “Everyday Italian” می رسد.

طول لیست گره Node List Length

یک node list object همواره سعی در به روز رسانی خود دارد. بنابرین اگر یک عنصر حذف یا اضافه شود، لیست به طور خودکار به روز می شود.
ویژگی لیست گره یا length property در واقع در تعداد گره های آن لیست است.
قطعه کد زیر تعداد عناصر <title> را در books.xml باز می گرداند:

مثال :

x = xmlDoc.getElementsByTagName('title').length;

1	x = xmlDoc.getElementsByTagName('title').length;

بعد از اجرای statement بالا، مقدار x برابر ۴ خواهد بود.
نکته: طول لیست گره می تواند از طریق تمام عناصر موجود در لیست استفاده شود.
قطعه کد زیر با استفاده از Loop همه عناصر لیست را مورد استفاده قرار می دهد.

مثال :

x = xmlDoc.getElementsByTagName('title');
xLen = x.length;

for (i = 0; i <xLen; i++) {
    txt += x[i].childNodes[0].nodeValue) + " ";
}

x = xmlDoc.getElementsByTagName('title');

xLen = x.length;

for (i = 0; i <xLen; i++) {

txt += x[i].childNodes[0].nodeValue) + " ";

}

خروجی:

مثال :

Everyday Italian
Harry Potter
XQuery Kick Start
Learning XML

Everyday Italian

Harry Potter

XQuery Kick Start

Learning XML

تشریح مثال بالا

۱٫فرض کنيد “books.xml” را به xmlDoc بارگذاري کرده ايد.

مثال : ooks.xml

<bookstore> 
   <book category="cooking"> 
       <title lang="en">Everyday Italian</title> 
       <author>Giada De Laurentiis</author> 
       <year>2005</year> 
       <price>30.00</price> </book> 
   <book category="children"> 
       <title lang="en">Harry Potter</title> 
       <author>J K. Rowling</author> 
       <year>2005</year> 
       <price>29.99</price> </book> 
   <book category="web"> 
       <title lang="en">XQuery Kick Start</title> 
       <author>James McGovern</author> 
       <author>Per Bothner</author> 
       <author>Kurt Cagle</author> 
       <author>James Linn</author> 
       <author>Vaidyanathan Nagarajan</author> 
       <year>2003</year> 
       <price>49.99</price> </book> 
   <book category="web" cover="paperback"> 
       <title lang="en">Learning XML</title> 
       <author>Erik T. Ray</author> 
       <year>2003</year> 
       <price>39.95</price> </book> 
</bookstore>

<title lang="en">Everyday Italian</title>

<author>Giada De Laurentiis</author>

<title lang="en">Harry Potter</title>

<author>J K. Rowling</author>

<title lang="en">XQuery Kick Start</title>

<author>James McGovern</author>

<author>Per Bothner</author>

<author>Kurt Cagle</author>

<author>James Linn</author>

<author>Vaidyanathan Nagarajan</author>

<title lang="en">Learning XML</title>

</bookstore>

۲٫ متغیر x را برای نگه داشتن یک لیست گره از تمام عناصر عنوان title elements تنظیم می نماید.
۳٫ مقادیر گره متن را از عناصر <title> جمع آوری می کند.

فهرست ویژگی های DOM یا (Named Node Map)

ویژگی attributes یک گره عنصری لیستی از گره های attribute را بازگردانی می نماید که به آن named node map گفته می شود و به یک لیست از گره که برای روش ها و ویژگی های متفاوتی در نظر گرفته شده است شباهت دارد.

یک attribute list همواره سعی در به روز رسانی خود دارد. بنابرین اگر یک عنصر حذف یا اضافه شود، لیست به طور خودکار به روز می شود.

قطعه کد زیر attribute nodes را از عنصر اول در books.xml باز می گرداند:

مثال :

x = xmlDoc.getElementsByTagName('book')[0].attributes;

1	x = xmlDoc.getElementsByTagName('book')[0].attributes;

پس از اجرای کد بالا، x.length = تعداد عناصر را تعیین می نماید و ()x.getNamedItem می تواند برای بازگرداندن گره attribute استفاده شود.
کد زیر ارزش ویژگی “category” و ویژگی number از book را به دست می آورد.

مثال :

x = xmlDoc.getElementsByTagName("book")[0].attributes;

txt = x.getNamedItem("category").nodeValue + " " + x.length;

x = xmlDoc.getElementsByTagName("book")[0].attributes;

txt = x.getNamedItem("category").nodeValue + " " + x.length;

خروجی:

مثال :

cooking 1

cooking 1

تشریح مثال بالا

۱٫فرض کنيد “books.xml” را به xmlDoc بارگذاري کرده ايد.

مثال : ooks.xml

<bookstore> 
   <book category="cooking"> 
       <title lang="en">Everyday Italian</title> 
       <author>Giada De Laurentiis</author> 
       <year>2005</year> 
       <price>30.00</price> </book> 
   <book category="children"> 
       <title lang="en">Harry Potter</title> 
       <author>J K. Rowling</author> 
       <year>2005</year> 
       <price>29.99</price> </book> 
   <book category="web"> 
       <title lang="en">XQuery Kick Start</title> 
       <author>James McGovern</author> 
       <author>Per Bothner</author> 
       <author>Kurt Cagle</author> 
       <author>James Linn</author> 
       <author>Vaidyanathan Nagarajan</author> 
       <year>2003</year> 
       <price>49.99</price> </book> 
   <book category="web" cover="paperback"> 
       <title lang="en">Learning XML</title> 
       <author>Erik T. Ray</author> 
       <year>2003</year> 
       <price>39.95</price> </book> 
</bookstore>

<title lang="en">Everyday Italian</title>

<author>Giada De Laurentiis</author>

<title lang="en">Harry Potter</title>

<author>J K. Rowling</author>

<title lang="en">XQuery Kick Start</title>

<author>James McGovern</author>

<author>Per Bothner</author>

<author>Kurt Cagle</author>

<author>James Linn</author>

<author>Vaidyanathan Nagarajan</author>

<title lang="en">Learning XML</title>

</bookstore>

۲٫ متغیر x را برای نگهداری لیستی از تمام attributes های اولین عنصر <book> تنظیم می کند.
۳٫ مقدار عنصر “category” و طول لیست ویژگی را بدست می آورد.

کلام آخر

در این جلسه آموزشی با آموزش کار با لیست گره ها در DOM همراه ما بودید.
در جلسه بعدی با آموزش جا به جایی در گره ها در DOM این دوره را ادامه می دهیم.
با پی وی لرن همراه باشید.

QR: جلسه ۳۲ : آموزش کار با لیست گره ها در DOM

به اشتراک بگذارید

دیدگاه کاربران

تعداد دیدگاه : 0

پی وی لرن – آموزش برنامه نویسی و طراحی وب سایت

دوره های آموزشی آکادمی پی وی لرن (پروژه محور و ویژه بازار کار)

جلسه ۳۲ : آموزش کار با لیست گره ها در DOM

مقدمه

آموزش کار با لیست گره ها در DOM

لیست DOM Node

طول لیست گره Node List Length

تشریح مثال بالا

فهرست ویژگی های DOM یا (Named Node Map)

تشریح مثال بالا

کلام آخر

لیست مطالب دوره

XML AJAX

XML DOM

XPath Tutorial

XSLT Tutorial

XQuery

DTD

مطالب ویژه

دسته های اصلی

برگه ها

بلاگ