دوره های آموزشی آکادمی پی وی لرن (پروژه محور و ویژه بازار کار)



  • ۲۰
  • مهر

جلسه ۲۰ : صفت id در html

  • دسته‌بندی‌ها :
جلسه ۲۰ : صفت id در html
    • جزئیات
    • نوع محتواآموزش تصویری

      مقدمه

      با عرض سلام خدمت کاربران سایت پی وی لرن . در آموزشهایی که در مطالب قبلی در مورد  html ، ارائه گردید. توضیحات مفصلی در مورد استفاده از صفت class در html ، ارائه شد. در این بخش از آموزش نیز قصد داریم. به موضوع آموزش استفاده از صفت id در html یا ویژگی id در html و کاربرد id در html ، بپردازیم. صفت id ، در واقع یک مقدار منحصر به فرد را برای یک عنصر html را تعریف می کند.

      صفت id ، همانند صفت class یک نام را برای شناسایی و دستیابی به هر کدام از  عنصر html. در کدهای css و جاوااسکریپت مشخص می کند. مقدار هر id برای هر کدام از عناصر html باید یکتا و منحصر به فرد باشد.

      در ادامه به موضوع چگونگی استفاده از صفت id در html ، می پردازیم.

      ویژگی id در html

      ویژگی id در html

      استفاده از صفت یا ویژگی id در html

      همانطور که اشاره شد. صفت id ، همانند class برای دستیابی به ویژگی های یک عنصر ، در کدهای css و جاوااسکریپت ، مورد استفاده قرار می گیرد. اما مقدار id حتما باید منحصر به فرد بوده و در سایر عناصر تکرار نشود.

      مثال: استفاده از کدهای css برای تغییر دادن محتویات عناصری با id با مقدار “myHeader” :

      مثال : صفت id
      خودتان امتحان کنید »

      نتیجه ی کد فوق :

      نتیجه ی header

      تفاوت بین صفات id و class

      تفاوت عمده بین id و class ، این است. که مقدار id ، در هر عنصر html باید یکتا باشد. و تکرار نشود ، اما یک نام  class می تواند در چندین عنصر تکرار شود.

      مثال:

      مثال : تفاوت id و class
      خودتان امتحان کنید »

      bookmark با استفاده از id و link

      bookmark ها اغلب برای ایجاد قابلیت پرش از قسمتی از صفحه وب به قسمتی دیگر برای خوانندگان صفحات وب ایجاد می شوند.

      Bookmark ها معمولا در صفحات وب طولانی و بلند کاربرد دارند.

      در ابتدا باید Bookmark را ایجاد کرده و سپس یک لینک به آن بدهید.

      سپس وقتی که کاربر روی آن کلیک کند، مرورگر به جایی که Bookmark ایجاد شده اسکرول می شود.

      مثال :

      ابتدا یک صفت id به عنصر مربوطه برای ایجاد Bookmark اضافه کنید :

      مثال : 

      حالا یک لینک به bookmark در همان صفحه وب ایجاد کنید:

      مثال : 

      و یا اینکه از صفحات دیگر یک لینک به bookmark آن صفحه بدهید :

      مثال : لینک از صفحات دیگر
      خودتان امتحان کنید »

      استفاده از id در جاوااسکریپت

      جاوا اسکریپت می تواند. با استفاده از صفت id ، و تابع ()getElementById ، به یک عنصر html دسترسی پیدا کند.

      مثال: استفاده از جاوااسکریپت برای تغییر دادن محتوای عناصر:

      مثال : استفاده از id در جاوا اسکریپت
      خودتان امتحان کنید »

      کلام آخر

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

      QR:  جلسه ۲۰ : صفت id در html
      به اشتراک بگذارید


      دیدگاه کاربران
      1. تصویر کاربر
        • تصویر کاربر