موضوع: طراحی سایت تاریخ انتشار: 1 سال قبل

شئ document  :

در این قسمت می خوایم در مورد شئ document صحبت کنیم اگر با DOM آشنا هستید که خیلی خوبه اما اگر چیزی نمی دونید به لینک  http://www.w3schools.com/js/js_htmldom.asp برید و در مورد DOM مطالعه کنید .

من فایل index.html را به شکل زیر تغییر می دهم :

در کد بالا مشاهده می کنید که تگ اسکریپت را در پایین صفحه قرار دادم ، یکی از دلایل که این کار را انجام دادم این است که مرورگر صفحه html  را از بالا به پایین می خواند پس اگر تگ اسکریپتم را بالا قرار دهم مرورگر زمانی را نیاز دارد تا کدهای جاوا اسکریپت من را لود کند قبل از اینکه کدهای body را بخواند پس باعث می شود لود صفحه html من زمان برشود صفحه کند لود شود.

دلیل دگه اینکه اگر درکدهای جاوا اسکریپت با المنت های صفحه html  کار داشته باشم ، باید آن المنت ها لود شود تا کد من به آنها دست رسی پیدا کند ، پس اگر من تگ اسکریپتم را بالا قرار دهم هنوز تگ های p لود نشده اند تا کدهای js من با آنها ارتباط برقرار کنند ، پس در این شرایط بهترین جا برای تگ اسکریپت همان پایین است.

در کدهای js من میخوام محتوای تگ های p را یکی نمایش دهم ، به کد زیر دقت کنید:

یک متغییر به نام elementHayeP ایجاد کردم و تمام تگ های p که در صفحه html وجود دارد را با دستور document.getElementByTagName داخل این متغییر ریختم ، چیزی که متد getElementByTagName به من بر می گرداند شبیه یک آرایه است ، در واقع آبجکتی به نام NodeList را به من بر می گرداند.

سپس یک حلقه for ساختم و با innerHTML محتوای هر p را نمایش دادم .

حالا اگر من فقط محتوای یک تگ p  خواص را نیاز داشته باشم چطور ؟ خوب اول یک id به آن تگ اختصاص می دهم .

سپس درindex.js این کد را می نویسم.

برای پیدا کردن تگ p خواصی که می خواستم از متد getElementById استفاده کردم و برای گرفتن محتوای آن تگ از innerHTML استفاده شده.

متد دیگری هم هست که می توانیم ازآن استفاده کنیم و آن querySelector و querySelectorAllاست ،  getElementTagNameوgetElementById سریع تر از querySelector وquerySelectorAllاست برای هیمن من از این متدها استفاده نمی کنم ، می تونید در موردquerySelector کمی تحقیق کنید.

در قسمت بعدی شما را با ساخت Element و Attributes آشنا می کنم.

اشتراک گذاری:
http://darkoobweb.com/?p=468

درباره نویسنده پوریا

سلام. من پوریا هستم. به برنامه نویسی علاقه مندم. حدود دو سال است در سامانه‌ی آموزشی خدماتی دارکوب وب فعالیت می‌کنم. امیدوارم آموزش‌هایی که در وب‌سایت قرار می‌دهم برای شما مفید باشد. موفق باشید. {^}

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *