آموزش ویژگی value در DOM جاوااسکریپت

سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش ویژگی value در DOM جاوااسکریپت با من همراه باشید.

ویژگی value در DOM جاوااسکریپت

Free-Learn

ویژگی value در DOM جاوااسکریپت

با استفاده از ویژگی value ما میتونیم هم مقدار یک صفت رو از یک تگ بگیریم و هم میتونیم یک مقدار جدید به همون صفت بدهیم.

با استفاد از ویژگی name نیز میتونیم نام یک صفت رو بدست آوریم.

مقدار برگشتی برگشت مقدار صفت از یک نام گره مشخص شده
نسخه DOM Core Level 1

Free-Learn

مثال از این ویژگی

در ادامه میتوانید یک مثال از این ویژگی را در زبان جاوا اسکریپت مشاهده نمایید.

مثال شماره ۱ : بدست آوردن مقدار صفت class از تگ و نمایش در خروجی.

امتحان کنید

مثال شماره ۲ : ست کردن مقدار جدید به صفت class

امتحان کنید

توضیح مثال بالا :

خب در مثال بالا تگ H2 بصورت پیش فرض یه کلاس بنام test براش تعریف کردیم و حالا استایل دلخواه بهش دادیم، حال در ادامه یه کلاس دیگه بنام new-class تعریف کردیم و باز استایل دلخواه بهش دادیم.

بعدش اومدیم صفت کلاس رو از تگ H2 گرفتیم و مقدار جدید ( همون کلاس new-class ) رو بهش دادیم، حالا اگه بروی دکمه کلیک شه کلاس new-class نیز به تگ H2 اضافه خواهد شد.

Free-Learn

پشتیبانی مرورگرها

در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از این ویژگی در جاوااسکریپت پشتیبانی میکنند یا خیر.

نام ویژگی Chrome Firefox Opera Safari IE
value بله بله بله بله بله

Free-Learn

شکل نوشتاری

نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این ویژگی در جاوااسکریپت بصورت زیر می باشد.

  • برای گرفتن مقدار صفت

  • برای ست / تنظیم کردن مقدار صفت

Free-Learn

نکات و توضیحات

  • برای اضافه کردین چندین کلاس بصورت همزمان کافیه بین نام کلاس ها ۱ عدد فاصله قرار دهید. مثال :

Free-Learn

مثال های بیشتر

مثال شماره ۱ : اضافه کردن حالت شب به صفحه ( با کلیک بروی دکمه حالت شب فعال میشه )

امتحان کنید

توضیح مثال بالا :

خب همونطور که در مثال شماره ۲ ( کمی بالاتر ) مشاهده کردید ما به راحتی میتونیم مقدار جدید به صفت مورد نظرمون بدیم ، حال اومدیم با استفاده از این روش حالت شب یا Night Mode یا Dark Mode رو پیاده سازی کردیم.

یعنی باید وقتی بروی دکمه کلیک میشه، کلاس dark-mode به تگ body اضافه شه و وقتی این کلاس به تگ Body اضافه شه یعنی حالت شب فعال شده.

فقط دیگه حواستون باشه برای اینکه بتونید استایل در حالت شب بدید باید اول یه body.dark-mode بنویسید بعدش دیگه اون کلاس یا id یا تگ یا هرچیزی که خواستید حالت شب بگیره رو وارد کنید. مثال :

Free-Learn

دریافت PDF یا پرینت این مطلب