این آموزش در تاریخ ۱۴۰۱/۰۶/۰۲ آپدیت شده است.
آموزش ویژگی nodeName در DOM جاوااسکریپت
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش ویژگی nodeName در DOM جاوااسکریپت با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
ویژگی nodeName در DOM جاوااسکریپت
با استفاده از ویژگی nodeName همونطور که از اسمشم مشخصه میتونیم نام یک گره رو بدست آوریم، این ویژگی در شرایط زیر مقادیر مختلفی در خروجی نمایش میدهد :
- اگه گره عنصر بود نام خوده عنصر / تگ رو بصورت حرف بزرگ انگلیسی برگشت میده
- اگه گره صفت بود، نام صفت رو برگشت میده
- اگه گره متن بود text# برگشت میده
- اگه گره کامنت ( یا Comment ) بود comment# برگشت میده
- اگه گره سند ( یا Document ) بود document# برگشت میده
با استفاد از ویژگی tagName نیز میتونیم نام یک تگ رو بدست آوریم و تفاوتش با nodeName در اینه که، nodeName نام گره ( که میتونه گره عنصر یا گره متن یا گره صفت یا گره کامنت باشه ) رو برگشت میده ولی tagName فقط نام خوده تگ رو برگشت میده.
| مقدار برگشتی | برگشت نام گره / عنصر / تگ |
|---|---|
| نسخه DOM | DOM Level 1 |
Free-Learn
مثال از این ویژگی
در ادامه میتوانید یک مثال از این ویژگی را در زبان جاوا اسکریپت مشاهده نمایید.
مثال شماره ۱ : بدست آوردن نام خوده تگ ها
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
<script> var a = document.getElementById("MyDiv"); var b = document.getElementById("MyP"); var c = document.getElementById("MyH2"); document.write( "نام گره اول هست : " + a.nodeName ); document.write("<br><br>"); document.write( "نام گره دوم هست : " + b.nodeName ); document.write("<br><br>"); document.write( "نام گره سوم هست : " + c.nodeName ); </script> |
مثال شماره ۲ : نمایش گره ها در حالت های مختلف ( گره عنصر، گره متن ، گره کامنت )
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 |
<script> function Get(){ 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 |
| nodeName | بله | بله | بله | بله | بله |
Free-Learn
شکل نوشتاری
نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این ویژگی در جاوااسکریپت بصورت زیر می باشد.
|
1 |
Element.nodeName; |
Free-Learn
نکات و توضیحات
- با استفاده از ویژگی nodeName میتونیم نام گره رو بدست آوریم.
- با استفاده از ویژگی nodeType میتونیم نوع گره رو بدست آوریم.
- با استفاده از ویژگی nodeValue میتونیم مقدار داخل گره رو بدست آوریم.
