تعیین یک مقدار (Value) متناظر با محتوا، که می تواند توسط اسکریپت ها (Script) (مثلا توسط کدهای JavaScript) پردازش شود، با تگ data ، در HTML

تگ data در HTML ، از محتوایی که در خود دارد، یک مقدار (Value) متناظر با محتوا (نسخه قابل خواندن توسط ماشین (Machine Readable Version)) را نیز ارائه می دهد (یک مقدار متناظر قابل پردازش توسط زبان های برنامه نویسی).

یعنی، علاوه بر خود محتوای اصلی که در بین زوج تگ data قرار می گیرد و کاربر در خروجی صفحه می بیند، یک مقدار (اطلاعات) معادل آنها نیز توسط مشخصه value از تگ data ، در میان کدهای صفحه قرار می گیرد که می تواند برای پردازش توسط اسکریپت ها (Script) (مثلا توسط کدهای JavaScript) مورد استفاده قرار گیرد (هر نوع پردازش توسط کدهای زبان های برنامه نویسی).

به عنوان مثال، کد HTML زیر را در نظر بگیرید :

در کد بالا، عبارت های One و Two و Three در خروجی صفحه نمایش داده می شوند (به معنی سه عدد یک و دو و سه)، اما علاوه بر این خروجی، مقدار عددی متناظر با هر یک از این سه عبارت نیز در تگ data ، توسط مشخصه value ذکر شده است.

بنابراین یک اسکریپت (Script) (مثلا کدهای JavaScript) می تواند این مقادیر عددی متناظر را از تگ های data بخواند و پردازش مورد نظر خود را بر روی آن اعداد اجرا نماید.

به مثال زیر توجه کنید :

مثال

یک فهرست (List) می سازیم که شامل سه آیتم (Item) به صورت سه عبارت One و Two و Three می باشد و همچنین مقدار عددی متناظر با آنها (یعنی 1 و 2 و 3) را نیز با تگ data مشخص می کنیم.

سپس با استفاده از مقداری کد CSS ، تعیین می کنیم که اگر کاربر، موس خود را بر روی هر یک از آیتم های (Item) آن فهرست (List) ببرد، مقدار عددی متناظر آن آیتم (Item) که توسط مشخصه value از تگ data تعیین شده است را به صورت یک عبارت قرمز رنگ نمایش دهد.

خروجی نهایی به صورت زیر می باشد :

خطا - صفحه را دوباره بارگذاری کنید

کد فهرست (List) :

کد CSS :

کد کامل صفحه HTML :

نتیجه :

خطا - صفحه را دوباره بارگذاری کنید
نویسنده علیرضا گلمکانی
شماره کلید 26727
گزینه ها
به اشتراک گذاری (Share) در شبکه های اجتماعی
نظرات 0 0 0

ارسال نظر جدید (بدون نیاز به عضو بودن در وب سایت)