این آموزش در تاریخ ۱۴۰۱/۰۶/۰۲ آپدیت شده است.
آموزش ویژگی nodeType در DOM جاوااسکریپت
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش ویژگی nodeType در DOM جاوااسکریپت با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
ویژگی nodeType در DOM جاوااسکریپت
با استفاده از ویژگی nodeType
میتونیم نوع یا ( Type ) یک گره را بدست آوریم، و همونطور که میدونید نوع گره ها هم میتونه به نسبت خوده گره متفاوت باشه، مثلا نوع گره متن میشه عدد ۳ و در خروجی این عدد چاپ میشه.
نام گره به فارسی | نام گره به انگلیسی | Type و مقدار برگشتی | مثال |
---|---|---|---|
گره عنصر یا تگ | ELEMENT_NODE | ۱ | <h2> |
گره متن | TEXT_NODE | ۳ | Test |
گره کامنت یا توضیحات | COMMENT_NODE | ۸ | <– Test –!> |
گره سند یا صفحه | DOCUMENT_NODE | ۹ | <html> |
گره نوع سند یا صفحه | DOCUMENT_TYPE_NODE | ۱۰ | <Doctype html!> |
Free-Learn
مثال از این ویژگی
در ادامه میتوانید یک مثال از این ویژگی را در زبان جاوا اسکریپت مشاهده نمایید.
مثال شماره ۱ : بدست آوردن نوع گره عنصر ( Element_Node )
1 2 3 4 5 6 7 8 9 |
<script> var MyTag = document.getElementById("MyP"); document.write( "Node Name : " + MyTag.nodeName ); document.write("<br><br>"); document.write( "Node Type : " + MyTag.nodeType ); </script> |
مثال شماره ۲ : با کلیک بروی یک دکمه، بصورت دسته جمعی نام گره هارو نمایش داده میشه و کلیک بروی دکمه دیگه نوع گره هارو
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
<script> function Get_Type(){ var MyBox , i , MyText , Result; MyBox = document.getElementById("MyBox").childNodes; Result = document.getElementById("Result"); MyText = ""; for( i = 0; i < MyBox.length; i++ ){ MyText = MyText + MyBox[i].nodeType + "<br>"; } Result.innerHTML = MyText; } function Get_Name(){ var MyBox , i , MyText , Result; MyBox = document.getElementById("MyBox").childNodes; Result = document.getElementById("Result"); MyText = ""; for( i = 0; i < MyBox.length; i++ ){ MyText = MyText + MyBox[i].nodeName + "<br>"; } Result.innerHTML = MyText; } </script> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از این ویژگی در جاوااسکریپت پشتیبانی میکنند یا خیر.
نام ویژگی | Chrome | Firefox | Opera | Safari | Edge |
nodeType | بله | بله | بله | بله | بله |
Free-Learn
شکل نوشتاری
نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این ویژگی در جاوااسکریپت بصورت زیر می باشد.
1 |
Element.nodeType; |
Free-Learn
نکات و توضیحات
- با استفاده از ویژگی nodeName میتونیم نام گره رو بدست آوریم.
- با استفاده از ویژگی nodeType میتونیم نوع گره رو بدست آوریم.
- با استفاده از ویژگی nodeValue میتونیم مقدار داخل گره رو بدست آوریم.