اسناد HTML DOM
< JavaScript:JS HTML DOM(تغییرمسیر از JavaScript:اسناد html dom)
پرش به ناوبری
پرش به جستجو
شیء HTML DOM document شیءست که صاحب تمامی اشیاء در صفحه وب شماست.[۱]
شیء HTML DOM Document
شیء سند (document object) صفحه وب شما را ارائه می‌دهد.
اگر شما می‌خواهید که به هر نوع عنصر در صفحه HTML دسترسی داشته باشید، شما همیشه از دسترسی با شیء سند (document object) شروع می‌کنید.
در زیر مثال‌هایی برای شرح چگونگی استفاده شیء سند (document object) برای دسترسی و تغییر HTML وجود دارد.
پیدا کردن عناصر HTML
| متد | توضیحات |
|---|---|
| document.getElementById(id) | یک عنصر را بر اساس شناسه یا id عنصر پیدا می‌کند |
| document.getElementsByTagName(name) | عنصر را بر اساس نام تگ پیدا می‌کند |
| document.getElementsByClassName(name) | عنصر را بر اساس نام کلاس پیدا می‌کند |
تغییر عناصر HTML
| ویژگی | توضیحات |
|---|---|
| element.innerHTML = new html content | مقدار ویژگی innerHTML یک عنصر را تغییر می‌دهد |
| element.attribute = new value | مقدار یک خاصیت از یک عنصر HTML را تغییر می‌دهد |
| element.style.property = new style | استایل یک سند HTML را تغییر می‌دهد |
| متد | توضیحات |
| element.setAttribute(attribute, value) | مقدار یک خاصیت (attribute) یک عنصر HTML را تغییر می‌دهد |
اضافه و حذف کردن عناصر
| متد | توضیحات |
|---|---|
| document.createElement(element) | ساخت یک عنصر HTML |
| document.removeChild(element) | حذف یک عنصر HTML |
| document.appendChild(element) | اضافه کردن یک عنصر HTML |
| document.replaceChild(new, old) | جابه‌جا کردن یک عنصر HTML |
| document.write(text) | نوشتن یک رشته متنی در خروجی سند HTML |
اضافه کردن مدیریت رویدادها
| متد | توضیحات |
|---|---|
| document.getElementById(id).onclick = function(){code} | اضافه کردن مدیریت رویداد برای رویداد کلیک روی عنصر |
پیدا کردن عناصر HTML
اولین مرحله از HTML DOM (سال ۱۹۹۸)، ۱۱ عنصر HTML، مجموعه اشیاء و ویژگی را تعریف کرد. این موارد هنوز در HTML5 معتبر هستند.
بعدا در HTML DOM مرحله ۳، اشیاء مجموعه‌ها و ویژگی‌های بیشتری اضافه شدند.
| ویژگی | توضیحات | Dom |
|---|---|---|
| document.anchors | تمامی عناصر <a> را که یک خاصیت نام name دارند را برمی‌گرداند | ۱ |
| document.anchors | تمامی عناصر <applet> را برمی‌گرداند (این مورد در HTML 5 منسوخ شده‌است) | ۱ |
| document.baseURI | URI پایه و مطلق سند را برمی‌گرداند | ۳ |
| document.body | عنصر <body> را برمی‌گرداند | ۱ |
| document.cookie | کوکی سند را برمی‌گرداند | ۱ |
| document.doctype | نوع سند را برمی‌گرداند | ۳ |
| document.documentElement | عنصر <html> را برمی گرداند | ۳ |
| document.documentMode | حالتی که مرورگر از آن استفاده می‌کند را برمی‌گرداند | ۳ |
| document.documentURI | URI سند را برمی‌گرداند | ۳ |
| document.domain | نام دامنه (domain name) فایل سند را برمی‌گرداند | ۱ |
| document.domConfig | منسوخ شده. تنظیمات مربوط به DOM را به طور کامل برمی‌گرداند | ۳ |
| document.embeds | تمامی عناصر <embed> را برمی‌گرداند | ۳ |
| document.forms | تمامی عناصر <form> را برمی‌گرداند | ۱ |
| document.head | عنصر <head> را برمی‌گرداند | ۳ |
| document.images | تمامی عناصر <img> را برمی‌گرداند | ۱ |
| document.implementation | پیاده‌سازی DOM را برمی‌گرداند | ۳ |
| document.inputEncoding | Encoding یا character set فایل سند را برمی‌گرداند | ۳ |
| document.lastModified | تاریخ و زمان بروزرسانی فایل سند را برمی‌گرداند | ۳ |
| document.links | تمامی عناصر <area> و <a> که خاصیت href دارند را برمی‌گرداند | ۱ |
| document.readyState | وضعیت بارگذاری صفحه سند را برمی‌گرداند | ۳ |
| document.referrer | URI فایل referrer یا فایل لینک شده را برمی‌گرداند | ۱ |
| document.scripts | تمامی عناصر <script> را برمی‌گرداند | ۳ |
| document.strictErrorChecking | در صورتی که بررسی خطا اجباری باشد مقداری را برمی‌گرداند | ۳ |
| document.title | عنصر <title> را برمی‌گرداند | ۱ |
| document.URL | آدرس کامل (URL) فایل سند را برمی‌گرداند | ۱ |
منابع آموزشی