سبد (0)

تبلیغات

مثال های مربوط به DOM

در مثال های زیر، JavaScript با استفاده از مدل DOM، می تواند به تمام عناصر صفحه HTML دسترسی داشته باشد.


شیء Document

()document.write - نوشتن یک متن در خروجی
()document.write - نوشتن تگ های HTML در خروجی
length - برگرداندن تعداد لینک های داخل صفحه
innerHTML - برگرداندن متن اولین لینک استفاده شده در صفحه
length - برگرداندن تعداد فرم های استفاده شده در یک صفحه
name - برگرداندن مقدار خصوصیت name فرم
length - برگرداندن تعداد عکس های استفاده شده در صفحه
id - برگرداندن id اولین عکس در صفحه
length - برگرداندن تعداد لینک های یک صفحه
id - برگرداندن id اولین لینک در صفحه
document.cookie - برگرداندن نام و مقدار کل Cookieی ها
domain - برگرداندن نام دامنه
lastModified - برگردان زمان آخرین باری که صفحه اصلاح شده
referrer - برگرداندن URL صفحه
title - برگرداندن عنوان صفحه
URL - برگرداندن کل URL صفحه
open - باز کردن یک صفحه جدید در فریم جاری و نوشتن متن داخل آن
open - باز کردن یک صفحه در پنجره جدید و نوشتن متن داخل آن
تفاوت بین write و writeln
innerHTML - نمایش محتوای یک عنصر با id مشخص
length - نمایش تعداد عناصری که name یکسانی دارند
length - نمایش تعداد یک tag خاص در صفحه


شیء Anchor (لینک)

charset - برگرداندن و یا تنظیم خصوصیت charset در یک لینک
href - برگرداندن مقدر خصوصیت href یک لینک
hreflang - برگرداندن و تنظیم خصوصیت hreflang
name - برگردان مقدار خصوصیت name یک لینک
rel - برگرداندن مقدار خصوصیت rel لینک
target - تغییر مقدار خصوصیت target لینک
type - برگرداندن مقدار خصوصیت type لینک

Area Object

alt - برگرداندن مقدار خصوصیت alt در تگ area
Return the coordinates of an area in an image-map
Return the anchor part of the href attribute of an area
Return the hostname:port for an area in an image-map
Return the hostname for an area in an image-map
Return the port for an area in an image-map
Return the href of an area in an image-map
Return the pathname for an area in an image-map
Return the protocol for an area in an image-map
Return the querystring part of the href attribute of an area
Return the shape of an area in an image-map
Return the value of the target attribute for an area in an image-map

More Area object examples in our JavaScript reference.

Base Object

Return the base URL for all relative URLs on a page
Return the base target for all links on a page

More Base object examples in our JavaScript reference.


شیء Button

disabled - غیرفعال کردن یک دکمه
name - برگرداندن خصوصیت name یک دکمه
type - برگرداندن خصوصیت type یک دکمه
value - برگرداندن متن نمایش داده شده روی یک دکمه
id - برگرداندن id فرمی که شامل یک دکمه است


شیء Form

value - برگرداندن مقادیر تنظیم شده عناصر داخل یک فرم
acceptCharset - برگرداندن مقدار خصوصیت accept-charset در یک فرم
action - برگرداندن مقدار خصوصیت action در یک فرم
enctype - برگرداندن مقدار خصوصیت enctype در یک فرم
length - برگرداندن تعداد عناصر داخل یک فرم
method - برگرداندن متد تنظیم شده در فرم برای ارسال اطلاعات به سرور
name - برگرداندن نام فرم
target - برگرداندن مقدار خصوصیت target در یک فرم
reset - خالی کردن و یا به حالت اول برگرداندن عناصر داخل فرم
submit - استفاده از یک دکمه معمولی برای ارسال فرم به سرور


شیء Frame/IFrame

align - ترازبندی یک iframe
backgroundColor - تغییر رنگ پس زمینه یک iframe
frameBorder - برگردان مقدار تنظیم شده برای خصوصیت frameborder
frameBorder - حذف لبه های یک iframe
height/width - تغییر عرض و ارتفاع یک iframe
longDesc - برگردان مقدار خصوصیت longdesc در یک iframe
marginHeight - برگردان مقدار خصوصیت marginheight در یک iframe
marginWidth - برگردان مقدار خصوصیت marginwidth در یک iframe
name - برگردان نام یک iframe
scrolling - برگردان و یا تنظیم خصوصیت scrolling در یک iframe
src - تغییر آدرس یک iframe


شیء Image

align - ترازبندی عکس ...
alt - برگرداندن متن جایگزین یک عکس
border - اضافه کردن لبه به عکس
height/width - تغییر عرض و ارتفاع یک عکس
hspace/vspace - تنظیم فاصله افقی و عمودی عکس از عناصر مجاور
longDesc - برگرداندن مقدار خصوصیت longdesc یک عکس
lowsrc - ایجاد یک لینک برای نمایش یک عکس در حالت با کیفیت پایین تر
name - برگرداندن نام یک عکس
src - تغییر آدرس یک عکس
useMap - برگرداندن مقدار تنظیم شده برای خصوصیت usemap در یک عکس


شیء Event

onblur - زمانی که کاربر TextBox را ترک می کند، کاراکترهای داخل آن به حروف بزرگ تبدیل می شود
onchange - زمانی که محتوای TextBox تغییر داده شود ...
onclick - زمانی که کاربر روی دکمه کلیک کند ...
ondblclick - زمانی که کاربر روی متن دابل کلیک کند ...
onerror - اگر زمان بارگذاری عکس، خطایی رخ دهد ...
onfocus - زمانی که مکان نما روی TextBox قرار می گیرد ...
onkeydown - قبل از رها کردن دکمه ی کیبورد ...
onkeypress - قبل از رها کردن دکمه ی کیبورد ...
onkeyup - بعد از رها کردن دکمه ی کیبورد ...
onload - بلافاصله بعد از اینکه صفحه بارگذاری شد ...
onload - بلافاصله بعد از اینکه عکس بارگذاری شد ...
onmousedown + onmouseup - قبل از رها کردن کلیک موس/بعد از رها کردن کلیک موس ...
onmousedown - قبل از رها کردن یکی از دکمه های موس، متوجه شوید کدام یک از دکمه های موس را کلیک کرده اید ...
onmousedown - قبل از رها کردن کلیک موس، متوجه شوید که روی کدام عنصر کلیک کرده اید ...
onmousemove + onmouseout - با حرکت موس، مختصات X و Y ظاهر می شود ...
onmouseover + onmouseout - با قرار گرفتن و خروج موس از روی تصویر ...
onresize - با تغییر اندازه پنجره مرورگر ...
onselect - بعد از انتخاب متن داخل TextBox، پیغامی ظاهر می شود ...
onunload - قبل از اینکه پنجره مرورگر بسته شود ...
onkeyup - بعد از رها کردن یکی از کلیدهای کیبورد، شماره آن کلید، نمایش داده می شود ....
onmousedown - بعد از فشردن کلیک موس، مختصات اشاره گر نسبت به Frame، نمایش داده می شود ...
onmousedown - بعد از فشردن کلیک موس، مختصات اشاره گر نسبت به صفحه مونیتور نمایش داده می شود ...
onmousedown - اگر همزمان با فشردن کلیک موس، دکمه Shift نیز فشرده شده باشد ...
onmousedown - با فشردن کلیک موس، نوع رویداد که همان onmousedown است نمایش داده می شود...


شیء Option و Select

disabled - فعال و غیرفعال کردن Dropdown List
id - برگرداندن شناسه (ID) فرمی که شامل یک Dropdown List است
length - برگرداندن تعداد گزینه های یک Dropdown List
size - تبدیل Dropdown List به MultiLine List
multiple - فعال و غیر فعال کردن حالت چند انتخابه در MultiLine List
options - نمایش همه ی گزینه های یک Dropdown List در یک پنجره Alert
selectedIndex - نمایش شماره (Index) گزینه انتخاب شده در یک Dropdown List
text - تغییر متن گزینه انتخاب شده در یک Dropdown List
remove - حذف گزینه انتخاب شده در یک Dropdown List


شیء Table

border - تغییر ضخامت لبه های بیرونی یک جدول
cellSpacing - تنظیم فاصله محتوای سلول ها از لبه - cellPadding و فاصله سلول ها با یکدیگر
frame - تنظیم اینکه کدام یک از لبه های بیرونی جدول نمایش داده شود
rules - تنظیم اینکه کدام یک از لبه های داخلی جدول نمایش داده شود
innerHTML - نمایش محتوای ردیف اول یک جدول در یک پنجره
innerHTML - نمایش محتوای یک سلول از جدول
()createCaption - ایجاد - Caption برای یک جدول
()deleteRow - حذف یک ردیف از جدول
()insertRow - اضافه کردن ردیف به یک جدول
()insertCell - اضافه کردن سلول به یک ردیف از جدول
align - میزان کردن محتوای سلول های یک ردیف بصورت افقی
vAlign - میزان کردن محتوای سلول های یک ردیف بصورت عمودی
align - میزان کردن محتوای یک سلول مشخص به صورت افقی
vAlign - میزان کردن محتوای یک سلول مشخص به صورت عمودی
innerHTML - تغییر محتوای یک سلول
colSpan - ادغام کردن سلول های یک ردیف

دیدگاه‌ها  

+6 # مینا نوبخت 1394-10-09 06:08
سلام چطوری میشه آیتم انتخاب شده رو توی دراپ داون با استفاده از متد get تعریف کرد
مثلا ما یه منو کشوی داریم حاوی مشاغل مورد نیاز وقتی متد گت شغل بازاریاب رو میاره چطوره میشه اون رو شغل بازاریاب رو تو منوی کشویی فعال کرد ؟ حتما میخوام منوی کشویی باشه که کاربر بتونه دوباره تغییر بده شغل مورد نظرش رو
با تشکر
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+5 # مهرداد صلاحی 1394-10-10 16:03
با سلام.
اگه منظورتون این هست که در لیست کشویی قصد دارید آیتم خاصی رو انتخاب کنید، باید به این نحو عمل کنید که شغل‌ها رو به نحوی (مثلا آرایه) ذخیره کنید و توسط حلقه‌ی for یا foreach تک تک مشاغل رو پیمایش کنید. بعد به شغل موردنظر که رسیدید به دراپ‌داون خاصیت selected بدید.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+6 # hossein gharedaghi 1394-07-27 11:18
سلام من الان css , html , java script رو تفریبا یاد گرفتم میتونم بگم که یک طراح سایت هستم یا نیازمند چیزی دیگه رو یاد بگیرم یا در حالت کلی به چه کسی میشه گفت طراحی سایت بلده؟؟
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+5 # مهرداد صلاحی 1394-07-27 11:40
با سلام.
قانون مشخصی برای سطح بندی نیست.
اگر شما قادر به اجرا و فهم کدهای مذکور هستید، میشه گفت طراح سایت هستید و اگر نه که هیچ!!!

شما باید دقت کنید که در بازار علاوه بر علم، تجربه هم نیاز هست. خیلی وقتها تجربه هست که مشکل شما رو رفع میکنه و نه لزوما علم اون چیز.
در مورد یادگیری که شما همیشه باید در حال یادگیری باشید، بالخصوص دنیای وب که همیشه در حال پیشرفت هست.
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+8 # farhadfm 1394-04-25 20:44
سلام و خسته نباشی با جاوا اسکریپت این امکان وجود دارد که مثلا تعداد سطر و ستون جدول وارد کنیم بعد جدول ایجاد شود
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+5 # احسان عباسی 1394-04-25 21:34
سلام
بله. کد مورد نظرتون رو در آدرس زیر ایجاد کردیم:
codepen.io/sbaloot/pen/dojYje
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+8 # webnoos.com 1394-02-21 19:43
مثال:
قبل از اینکه پنجره مرورگر بسته شود ...

کار نکرد
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن
+7 # امیر پهلوان صادق 1394-02-22 08:07
رویداد onUnload ممکن است بخاطر تنظیمات مختلف مرورگرها آنطور که انتظار دارید اجرا نشود ...!
برای اطمینان بیشتر، از کد زیر استفاده کنید:
<script type="text/java script">
function goodByeFromOnBe foreUnload() {
return "Hey, this window is getting closed !!!!";
}

function goodByeFromOnUn load() {
window.open('newpage.html', '_blank');
}
window.onbeforeunload = goodByeFromOnBeforeUnload;
window.onunload = goodByeFromOnUn load;

</script>
پاسخ دادن | پاسخ به نقل قول | نقل قول کردن

آموزش صوتی JavaScript

بستن
مدرس:
سوال و جواب:

ابزاری که در پیش روی دارید یکی از ابزارهای بسیار کاربردی سایت بیاموز در زمینه آموزش است، این ابزار برای سهولت یادگیری شما کاربران محترم طراحی شده است.

فقط کافی است روی عنوان پاراگراف مورد نظرتان کلیک کنید تا پخش صدا آغاز شود ...!

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین -  بانک ملت معرفی بیاموز در شبکه سه پرداخت آنلاین - بانک اقتصاد نوین پرداخت آنلاین - بانک سامان
 
دوره های آموزشی راه اندازی کسب و کارهای اینترنتی
تبلیغات اینترنتی