استفاده از DOM در جاوا اسکریپت به چه صورت است ؟
استفاده از DOM در جاوا اسکریپت به چه صورت است ؟
دسترسی به گره ها
تکه کد زیر را در نظر بگیرید
<html>
<head>
<title>DOM Example</title>
</head>
<body>
<p>Hello World!</p>
<p>Isn’t this exciting?</p>
<p>You’re learning to use the DOM!</p>
</body>
</html>
اولا براي دسترسی به عنصر HTML می توان از documentElement که یکی از خاصیت هاي شی document است استفاده کنیم. به صورت زیر:
var oHtml = document.documentElement;
حال می توانیم با استفاده از این متغیر به عناصر body و head به صورت زیر دسترسی داشته باشیم:
var oHead = oHtml.firstChild;
var oBody = oHtml.lastChild
راه دیگر به صورت زیر است:
var oHead = oHtml.childNodes[0];
var oBody = oHtml.childNodes[1];
براي بدست آوردن تعداد فرزندان یک گره:
alert(oHtml.childNodes.length); //outputs “2”
می توانیم از متدي موسوم به item() براي دسترسی نیز استفاده کنیم:
var oHead = oHtml.childNodes.item(0);
var oBody = oHtml.childNodes.item(1);
DOM همچنین از دستور document.body را براي دسترسی به عنصر body صفحه استفاده می کند.
var oBody = document.body;
می توانیم صحت رابطه هاي سه متغیر oHtml و oBody ، oHead را به صورت زیر نشان دهیم:
alert(oHead.parentNode == oHtml); //outputs “true”
alert(oBody.parentNode == oHtml); //outputs “true”
alert(oBody.previousSibling == oHead); //outputs “true”
alert(oHead.nextSibling == oBody); //outputs “true”
alert(oHead.ownerDocument == document); //outputs “true”
منبع : انجمن علمی مهندسی فناوری اطلاعات دانشگاه پیام تور مرکز اران و بید گل
برای اموزش های ویدیویی زبان جاوا اسکیریپت به بستر ویدیو های اموزشی بروید
