نحوه راه اندازی گوشی های هوشمند و رایانه های شخصی. پرتال اطلاعاتی
  • خانه
  • بررسی ها
  • مقدار ویژگی jquery را دریافت کنید. HTML: ویژگی های عنصر

مقدار ویژگی jquery را دریافت کنید. HTML: ویژگی های عنصر

هر ویژگی، به استثنای موارد منطقی، دارای مقداری است که به یکی از انواع زیر تعلق دارد: کلمه کلیدی، رشته، آدرس، عدد، درصد، کد زبان. اینها همه انواع نیستند، اما رایج ترین آنها هستند.

کلمه کلیدی

برخی از ویژگی‌ها مقادیر رزرو شده‌ای به نام «کلیدواژه» دارند. به عنوان مثال، مقدار ویژگی type عنصر نوع عنصر فرم را مشخص می کند. عنصر زیر یک دکمه ایجاد می کند.

کلمات کلیدی تابع مشخصات هستند، فهرست معانی آنها محدود است و نمی توان خودسرانه آن را تغییر داد.

خط

رشته متنی است که در گیومه های دوتایی یا تکی محصور شده است.

یک علامت نقل قول ابتدا و انتهای یک رشته را مشخص می کند، بنابراین نمی توانید علامت نقل قول اضافی را در داخل یک رشته قرار دهید. به عنوان مثال، خط زیر از ترکیب اشتباهی از نقل قول استفاده می کند.

برای نوشتن صحیح یک رشته با نقل قول های داخلی، چندین گزینه وجود دارد.

1. فرار از نقل قول داخلی به این صورت - \". در این صورت، دیگر توسط مرورگر به عنوان یک نقل قول درک نمی شود، بلکه یک نماد در نظر گرفته می شود.

2. از ترکیب گیومه های تک و دوگانه استفاده کنید.

در اینجا رشته در صفت title در یک گیومه محصور شده است، بنابراین می توانیم به راحتی یک نقل قول دوگانه در داخل آن بنویسیم.

همه اینها برای نقل قول های تک به یک شکل عمل می کند.

نشانی

آدرس مسیر یک سند، به عنوان مثال، یک فایل گرافیکی است. در مواردی که پیوندی به یک سایت، صفحه وب دیگر یا یک فایل خاص دانلود شده است، آدرس مورد نیاز است. به عنوان مثال، در عنصر آدرس به عنوان مقدار ویژگی src استفاده می شود؛ مسیر فایل همراه با تصویر را مشخص می کند.

آدرس مطلق و نسبی وجود دارد.

آدرس های مطلق

چنین آدرس هایی در همه جا و همه جا کار می کنند، صرف نظر از نام سایت یا صفحه وب که آدرس در آن تنظیم شده است و همیشه با نشان دادن پروتکل انتقال داده شروع می شود. برای صفحات وب، این معمولا HTTP (پروتکل انتقال ابرمتن) است، بنابراین آدرس های مطلق با کلمه کلیدی http:// شروع می شوند. مثال 1 پیوندی را نشان می دهد که از یک آدرس مطلق استفاده می کند.

مثال 1: استفاده از آدرس مطلق در پیوند

ارتباط دادن

گوگل

علاوه بر پروتکل HTTP، پروتکل امن HTTPS نیز وجود دارد. همیشه مشخص نیست که کدام پروتکل در یک سایت استفاده می شود، بنابراین می توان آن را به طور کلی از آدرس پیوند حذف کرد. آدرس در این مورد به صورت زیر نوشته می شود:

گوگل

آدرس‌های مطلق عمدتاً برای اشاره به یک منبع شبکه دیگر استفاده می‌شوند و به ندرت برای پیوندهای داخلی استفاده می‌شوند.

آدرس های نسبی

آدرس های نسبی از ریشه سایت یا سند فعلی مشخص می شوند. مثلا کد به معنای آپلود یک فایل گرافیکی به نام pic.png است که در همان پوشه ای که خود صفحه وب قرار دارد، قرار دارد. در ادامه به چند نمونه از این آدرس ها نگاه می کنیم.

/
آدرس معمولا به فایل index.html اشاره می کند که در ریشه سایت قرار دارد. اگر فایل index.html وجود نداشته باشد، مرورگر معمولاً فهرستی از فایل‌های موجود در دایرکتوری داده شده را نشان می‌دهد. نام فایل لازم نیست index.html باشد، این پارامتر را می توان از طریق تنظیمات وب سرور تغییر داد - این نام برنامه ای است که درخواست های دریافتی از مرورگر را تجزیه و تحلیل می کند و اسناد نشان داده شده به کاربر را به آن منتقل می کند.

/images/pic.png
یک خط تیره (/) قبل از آدرس نشان می دهد که آدرس دهی از ریشه سایت شروع می شود. پیوند به فایل pic.png که در پوشه images قرار دارد منتهی می شود. و این به نوبه خود در ریشه سایت قرار دارد.

../help/me.html
دو نقطه جلوی نام به مرورگر می‌گوید که در لیست پوشه‌های سایت یک سطح بالاتر برود و در پوشه راهنما فایلی به نام me.html را جستجو کند.

manual/info.html
اگر هیچ کاراکتر اضافی قبل از نام پوشه مانند نقطه یا خط تیره وجود نداشته باشد، پوشه در داخل پوشه فعلی قرار دارد و فایل info.html از قبل در آن است.

آدرس های مربوط به ریشه سایت مانند /demo/ فقط تحت کنترل یک سرور وب کار می کنند و در رایانه محلی قابل اجرا نیستند.

پیوندها

به عکس من نگاه کن!

چگونه همان عکس را بگیریم؟

گاهی اوقات می توانید آدرس هایی را به شکل ./file/doc.html پیدا کنید. یک نقطه در جلو به این معنی است که شمارش معکوس از پوشه فعلی است. چنین ورودی اضافی است و می تواند به file/doc.html کوتاه شود.

شماره

اعداد از اعداد 0 تا 9 تشکیل شده اند. برای اعداد منفی، در صورت لزوم، علامت منفی در جلو قرار می گیرد (-45). مثال 3 استفاده از اعداد را به عنوان مقادیر ویژگی نشان می دهد.

مثال 3: استفاده از اعداد

شماره

دمای آب

کم طبیعی داغ آب جوش

همانطور که در مثال 4 نشان داده شده است، علاوه بر اعداد صحیح، استفاده از کسرهای اعشاری مجاز است، به طوری که قطعات صحیح و کسری با یک نقطه از یکدیگر جدا شده اند - 36.6.

مثال 4: اعداد کسری

ورودی، حداکثر ویژگی

دمای خود را بر حسب درجه وارد کنید:

علاقه

نماد درصد به شما امکان می دهد به ابعاد عنصر والد بچسبید و ابعاد مربوط به آن را تنظیم کنید. فرض کنید کد زیر را داریم:

عنصر واقع در داخل

بنابراین عنصر

پدر و مادر خواهد بود . برعکس نیز صادق است - عنصر یک شرکت تابعه از

بر این اساس، در این حالت، عرض تصویر به صورت درصد از پاراگراف والد محاسبه می شود که به طور پیش فرض کل فضای خالی پنجره را در عرض اشغال می کند.

اگر نماد % بعد از عدد اضافه شود، مرورگر متوجه می شود که ما در مورد درصد صحبت می کنیم، به عنوان مثال: width="40%" .

مثال 5 کد یک صفحه وب را نشان می دهد که در آن عرض تصویر به صورت درصد مشخص شده است.

مثال 5. ابعاد تصویر بر حسب درصد

تصویر

نتیجه این مثال در شکل نشان داده شده است. 1. عرض تصویر روی 100% تنظیم شده است، بنابراین کل عرض موجود پنجره مرورگر را اشغال می کند. ارتفاع مشخص نیست و به صورت خودکار توسط مرورگر محاسبه می شود.

برنج. 1. اندازه تصویر بر حسب درصد

مزیت ضبط درصد این است که اندازه تصویر به جای ثابت ماندن، همراه با عرض پنجره مرورگر تغییر می کند. معایب آن عبارتند از بدتر شدن کیفیت تصویر در صورت کشیده شدن زیاد.

کد زبان

ما در عصر جهانی شدن زندگی می کنیم، زمانی که وب سایت ها حاوی متون به زبان های مختلف هستند. برای اینکه به موتورهای جستجو نشان دهید متن به چه زبانی نوشته شده است و تنظیمات خود را برای زبان های مختلف تنظیم کنید (مثلاً انواع نقل قول) و زبان متن را به صورت کد مشخص کنید. ویژگی lang برای تنظیم زبان استفاده می شود (مثال 6).

مثال 6: استفاده از ویژگی lang

زبان

عبارت در فرانسه

Je n"ai pas mangé depuis six jours

در این مثال، کل صفحه با استفاده از ویژگی lang با مقدار ru به روسی تنظیم شده است. برای نشان دادن اینکه زبان در کل صفحه اعمال می شود، ویژگی به عنصر اضافه می شود . برای متن فرانسوی، یک ویژگی lang با مقدار fr به عنصر اضافه می شود

شما می توانید مقادیر معتبر برای ویژگی lang را در این صفحه مشاهده کنید.

ولاد مرژویچ

هر ویژگی تگ حاوی مقداری از نوع خاص و فرمت نوشتاری است. انواع زیر از مقادیر متمایز می شوند: کلمات کلیدی، اعداد، تاریخ و زمان، رنگ ها، URL.

همه صفات با اصول زیر مشخص می شوند.

  • اگر مقداری به صراحت مشخص نشده باشد، از مقدار پیش فرض استفاده می شود یا ویژگی نادیده گرفته می شود.
  • اگر یک مقدار مشخصه نامعتبر مشخص شود، به عنوان مثال، متن به جای یک عدد اضافه شود، آنگاه مقدار آن مشخصه نادیده گرفته شده و از مقدار پیش فرض استفاده می شود.

همه خصیصه ها دارای مقدار پیش فرض نیستند، اگر چنین مشخصه ای گم شده باشد یا مقدار آن نادرست باشد، مشخصه نادیده گرفته می شود.

کلید واژه ها

این یک مجموعه ثابت معین از کلمات خاص است که می تواند به عنوان مقادیر ویژگی جایگزین شود. کلمات کلیدی به حروف بزرگ و کوچک حساس نیستند و می توان آنها را به هر روشی مناسب نوشت. پس معانی دستی، دستی و دستی در تأثیرشان یکسان است.

مثال 1 نحوه ایجاد فرمی را نشان می دهد که با استفاده از مقدار ویژگی post method به سرور ارسال می شود.

مثال 1: روش ارسال فرم

HTML5 IE Cr Op Sa Fx

کلید واژه ها

در این مثال، در عنصر

ویژگی روش با مقدار post استفاده می شود. اگر این ویژگی مشخص نشده باشد، مقدار دریافت پیش‌فرض جایگزین می‌شود. برای عنصر اول ویژگی type مشخص نشده است زیرا به طور خودکار با مقدار متن جایگزین می شود و برای دومی ویژگی type قبلاً برای ایجاد دکمه ارسال فرم مشخص شده است.

شماره

اعداد عبارتند از: اعداد صحیح مثبت حاوی یک یا چند رقم از 0 تا 9. اعداد منفی؛ و همچنین واقعی یا کسری (مثلاً 0.5).

اعداد صحیح مثبت

زمانی که لازم است تعداد ستون‌ها را تنظیم کنید، اندازه یک فیلد فرم و تعداد کاراکترهای وارد شده را محدود کنید، عرض و ارتفاع یک عکس را تنظیم کنید و غیره لازم باشد، به طور فعال استفاده می‌شوند. مثال 2 شروع ایجاد یک لیست شماره‌دار را نشان می‌دهد. با 11.

مثال 2: استفاده از یک عدد صحیح

HTML5 IE Cr Op Sa Fx

عدد صحیح

  1. چبوراشکا
  2. کروکودیل گنا
  3. شاپوکلیاک

اعداد صحیح منفی

اعداد صحیح منفی به دلایل واضح کمتر از اعداد صحیح مثبت استفاده می شوند. آنها را نمی توان برای تنظیم شمارش یا عرض استفاده کرد، فقط به این دلیل که هیچ عکسی با عرض منفی وجود ندارد. بنابراین در HTML، چنین اعدادی عمدتاً در فرم ها برای محدود کردن ورودی استفاده می شوند.

برای نشان دادن یک عدد منفی، قبل از آن علامت منفی (-) بدون فاصله قرار دهید (مثلا: -15). مثال 3 استفاده از مقادیر منفی را نشان می دهد.

مثال 3. عدد با علامت منفی

HTML5 IE Cr Op Sa Fx

اعداد منفی

یک عدد را با افزایش 2 وارد کنید

فایرفاکس از نوع عددی پشتیبانی نمی کند و به جای آن یک فیلد متنی معمولی را نمایش می دهد.

اعداد واقعی

این شامل اعداد اعشاری است و از یک نقطه برای جدا کردن اجزای کل و کسری استفاده می کند. عدد همچنین می تواند منفی باشد، سپس یک علامت منفی (-) در مقابل آن قرار می گیرد.

نمونه هایی از اعداد حقیقی: -0.84، 3.1415926، 1.717.

شکل دومی از نوشتن اعداد حقیقی وجود دارد، زمانی که بعد از عدد نماد لاتین e یا E اضافه می شود و سپس یک عدد نشان دهنده درجه است و می تواند با علامت منفی نیز باشد. این مشابه ضرب عدد قبل از E در 10 به توان بعد از E است. در اینجا چند مثال برای توضیح وجود دارد.

3.1415926e5 = 3.1415926 × 10 5 = 3.1415926 × 100000 = 314159.26

5e-2 = 5 × 10 -2 = 5 / 100 = 0.05

78e2 = 78 × 10 2 = 7800

مرورگر Opera با اعداد واقعی که دارای E بزرگ هستند به درستی کار نمی کند، بنابراین به جای آن از یک e کوچک استفاده کنید.

تاریخ و زمان

برای نشان دادن سال، ماه و سال یا تاریخ کامل و همچنین زمان استفاده می شود.

تاریخ و زمان در قالب خاصی مشخص شده است که نمونه ای از آن در جدول نشان داده شده است. 1.

هر واحد شکل و محدودیت های خاص خود را دارد.

  • سال در چهار رقم مشخص شده است (1860).
  • ماه - دو رقمی (01 - ژانویه، 02 - فوریه، 12 - دسامبر).
  • روز - دو عدد از 01 تا 31.
  • ساعت - دو رقمی از 00 تا 23.
  • دقیقه - دو رقمی از 00 تا 59.
  • ثانیه - دو رقم از 00 تا 59.
  • منطقه زمانی - ساعت و دقیقه با علامت مثبت یا منفی.

تاریخ و زمان با یک حرف لاتین بزرگ از هم جدا می شوند. منطقه زمانی در صورت لزوم بعد از زمان با علامت مثبت یا منفی نوشته می شود. به عنوان مثال، برای مسکو منطقه زمانی +03:00 خواهد بود.

رنگ ها

مقدار رنگ سه عدد از 0 تا 255 در هگزادسیمال است که نشان دهنده اجزای قرمز، سبز و آبی در فضای رنگی sRGB است. هر مقدار رنگ باید با یک نماد هش (#) شروع شود و در هر صورت شش عدد یا حرف زیر به دنبال آن باشد: 0، 1، 2، 3، 4، 5، 6، 7، 8، 9، A، B، C. , D, E, F. کاراکترهای دیگر مجاز نیستند. در مورد رنگ در HTML بیشتر ببینید.

URL

URL آدرس یک سند یا فایل است. شامل چندین بخش است که همه آنها اجباری نیستند. اینها پروتکل، نام میزبان، پورت، مسیر، رشته کوئری و هش هستند. روی میز 2 پارامترهای URL را با توضیحات آنها فهرست می کند.

جدول 2. پارامترهای URL
پارامتر شرح مثال
پروتکل پروتکل شبکه برای اسناد فرامتن این HTTP است. http://
https://
نام میزبان آدرس وب سایت. سایت اینترنتی
www.google.com
بندر یک منبع سیستمی که به یک وب سرور اختصاص داده شده است. مقدار پیش فرض 80 است، می توان آن را حذف کرد. :80
مسیر مسیر سند در وب سایت. /open/doc.html
رشته پرس و جو رشته ای که در آن پارامترهای درخواست GET با مقادیر ارسال می شود. بعد از علامت سوال (؟) نوشته می شود. ?name=vasya
هش خط بعد از علامت هش (#). #بالا

بسته به وجود پارامترهای خاص، آدرس های مطلق و نسبی متمایز می شوند. یک آدرس مطلق شامل پورت و نام میزبان است، یک آدرس نسبی شامل مسیر سند است. رشته کوئری و هش را می توان به هر نوع آدرسی اضافه کرد. اگر URL فقط حاوی هش باشد، سند فعلی به عنصری می‌رود که id="hash_name" دارد. در این حالت علامت هش در ویژگی id نوشته نمی شود.

URL تحت تأثیر ویژگی href قرار می گیرد؛ آدرس سندی که آن را در نظر می گیرد ممکن است متفاوت از آدرسی باشد که به صراحت مشخص شده است.

سوالات برای بررسی

1. کولیا در کد زیر یک عدد اشتباه نوشته است، اما اعتبار دهنده هیچ خطایی ایجاد نکرده است. چرا؟

2. داشا در خط از عدد 12g5 استفاده کرد

اما مرورگر کروم هیچ نتیجه ای را نشان نداد. چرا؟

3. چند راه در HTML برای تنظیم رنگ نارنجی وجود دارد؟

برای تست نمونه های زیر این صفحه را ذخیره کنید.

کتابخانه jQuery به شما اجازه می دهد تا مقادیر ویژگی های عناصر موجود در یک شی jQuery را دریافت و تنظیم کنید. روش های jQuery برای کار با ویژگی ها در جدول زیر توضیح داده شده است:

روش های کار با ویژگی ها
روش شرح
attr (نام) مقدار مشخصه را با نام مشخص شده برای اولین عنصر موجود در یک شی jQuery برمی گرداند.
attr (نام، مقدار) مقدار مشخصه را با نام مشخص شده برای همه عناصر موجود در یک شی jQuery تنظیم می کند
attr (نمایش شی) ویژگی های مشخص شده در شی نمایش را برای تمام عناصر موجود در شی jQuery تنظیم می کند
attr (نام، عملکرد) با استفاده از تابع، ویژگی مشخص شده را روی تمام عناصر موجود در یک شی jQuery تنظیم می کند
removeAttr(name)، removeAttr(name) ویژگی(ها) را از تمام عناصر موجود در یک شی jQuery حذف می کند
پایه (نام) مقدار ویژگی مشخص شده را برای اولین عنصر موجود در یک شی jQuery برمی‌گرداند
prop (نام، مقدار)، سرپ (شئ نمایشگر) مقدار یک یا چند ویژگی را برای همه عناصر موجود در یک شی jQuery تنظیم می کند
پایه (نام، عملکرد) مقدار ویژگی مشخص شده را برای تمام عناصر موجود در یک شی jQuery با استفاده از تابع تنظیم می کند
removeProp(نام) ویژگی مشخص شده را از تمام عناصر موجود در یک شی jQuery حذف می کند

اگر متد attr().با یک آرگومان فراخوانی شده، jQuery مقدار مشخصه مشخص شده را برای اولین عنصر در مجموعه انتخاب شده برمی گرداند. مثال مربوطه در زیر آورده شده است:

$(function() ( var srcValue = $("img").attr("src"); console.log("مقدار ویژگی: " + srcValue); ));

در این اسکریپت، تمام عناصر img را در سند انتخاب می کنیم و سپس از متد attr() برای بدست آوردن مقدار ویژگی src استفاده می کنیم که با خواندن آن یک رشته تولید می شود. نتیجه زیر بر روی کنسول نمایش داده می شود:

به دست آوردن مقدار مشخصه برای تمام عناصر موجود در یک شی jQuery با استفاده از متدهای each() و attr() با هم به دست می آید:

$(function() ( var srcValue = $("img").each(function(شاخص، عنصر) ( console.log("مقدار ویژگی Src: " + $(this).attr("src")); ) )))

در این اسکریپت، از شی HTMLElement که به عنوان آرگومان به تابع ارسال می شود، یک شی jQuery با استفاده از تابع ()$ ایجاد می شود. این شی شامل یک عنصر واحد است که برای متد attr() ایده آل است.

تنظیم مقادیر ویژگی

اگر از متد attr() برای تنظیم مقدار یک ویژگی استفاده شود، آنگاه این تغییر روی تمام عناصر موجود در شی jQuery اعمال می شود. بنابراین، در این مورد، روش رفتار متفاوتی نسبت به هنگام خواندن ویژگی ها دارد، زمانی که فقط مقدار ویژگی یک عنصر برگردانده می شود. هنگامی که یک ویژگی را تنظیم می کنید، متد attr() یک شی jQuery را برمی گرداند، به این معنی که می توانید تماس ها را زنجیره ای کنید.

یک نمونه اسکریپت که مقدار ویژگی را تنظیم می کند در زیر نشان داده شده است:

$(function() ($("img")..png"); ));

این اسکریپت تمام عناصر img را در سند انتخاب می کند و ویژگی src را به پیوندی به تصویر lily.png تنظیم می کند. مقدار تنظیم شده برای تمام عناصر انتخاب شده اعمال می شود، همانطور که در شکل نشان داده شده است:

تنظیم چندین ویژگی

شما می توانید مقادیر چندین ویژگی را با یک فراخوانی به متد attr() تنظیم کنید و یک شی را به عنوان آرگومان ارسال کنید. خصوصیات چنین شیئی به عنوان نام ویژگی ها و مقادیر ویژگی ها به عنوان مقادیر ویژگی تفسیر می شوند. این شی معمولاً شی نقشه نامیده می شود. مثال مربوطه در زیر آورده شده است:

$(function() ( var attrValues‎ = ( src: "http://site/downloads/jquery/lily.png"، style: "border: red solid solid" ); $("img").attr( attrValues) ;));

این اسکریپت یک شی ایجاد می کند که ویژگی هایی به نام src و style را تعریف می کند. سپس عناصر img در سند انتخاب شده و شیء نمایش به متد ()attr ارسال می شود. نمای صفحه در پنجره مرورگر در شکل نشان داده شده است:

تنظیم پویا مقادیر ویژگی

مقادیر تخصیص به ویژگی ها را می توان در زمان اجرای اسکریپت با ارسال یک تابع به عنوان آرگومان به متد ()attr تعیین کرد. مثال مربوطه در زیر آورده شده است:

$(function() ($("img").attr("src", function(index, oldVal) ( if (oldVal.indexOf("rose") >.png"; ) در غیر این صورت اگر ($(this). closest("#row2").length >.png"; ) )); ));

آرگومان های ارسال شده به تابع مشخص شده اندیس عنصر در حال پردازش در مجموعه و مقدار قبلی صفت هستند. این متغیر به شیء فعلی HTMLElement در حال پردازش اشاره دارد. اگر می خواهید یک ویژگی را تغییر دهید، تابع باید یک رشته حاوی مقدار جدید را برگرداند. اگر نتیجه برگردانده نشد، از مقدار مشخصه قبلی استفاده می شود. این مثال از تابع برای تغییر انتخابی تصاویر نمایش داده شده توسط عناصر img استفاده می کند.

حذف صفات

ویژگی ها را می توان با استفاده از روش حذف (حذف نصب) کرد removeAttr()، همانطور که در مثال زیر نشان داده شده است.

نحوه تنظیم یا تغییر مقدار یک ویژگی با استفاده از jQuery

5 (100%) 3 رای

کتابخانه jQuery توانایی تنظیم یا تغییر مقدار ویژگی ها را به دو صورت فراهم می کند. برای تنظیم و تغییر مقدار مشخصه ها از متد ()attr استفاده می شود. ما قبلاً در مورد این روش صحبت کرده ایم - علاوه بر نصب یا تغییر، با استفاده از این روش می توانیم.

نحو متد ()attr برای تنظیم/تغییر مقدار

  • attr (نام، مقدار)
    • صفت مشخص شده را برای تمام عناصر موجود در شی jQuery به مقدار پاس شده تنظیم می کند.
  • گزینه ها
    • name — (رشته) نام صفتی که قرار است تنظیم شود.
    • مقدار — (رشته | شماره | بولی | تابع) مقدار مشخصه را مشخص می کند که می تواند هر عبارت جاوا اسکریپت باشد. هر مقداری غیر از تابع به رشته تبدیل می شود. تابع برای هر عنصر در مجموعه فراخوانی می شود و شاخص عنصر و مقدار فعلی ویژگی را با نام داده شده در عنصر ارسال می کند. مقدار بازگردانده شده توسط تابع به مقدار مشخصه تبدیل می شود.
  • برمی گرداند
    • مجموعه جی کوئری

مثال استفاده:

$("#my_image").attr("title", "My Image");

اولین گزینه با استفاده از روش در نگاه اول ساده به نظر می رسد، اما اینطور نیست! همانطور که قبلاً فهمیدیم، دومین پارامتر (مقدار) متد .attr() مقداری را می گیرد که تنظیم می شود. مقدار می تواند هر عبارت جاوا اسکریپتی باشد که در نهایت یک رشته را برمی گرداند.

وقتی پارامتر مقدار یک تابع داخلی یا یک مرجع تابع باشد، بسیار جالب‌تر می‌شود. در چنین مواردی، تابع برای هر عنصر بازیابی شده فراخوانی می شود و مقدار بازگشتی تابع به عنوان مقدار مشخصه استفاده می شود. هنگامی که یک تابع فراخوانی می شود، دو پارامتر به آن ارسال می شود. یکی از آنها شامل شاخص مبتنی بر صفر عنصر در مجموعه است و دیگری حاوی مقدار فعلی ویژگی با نام عنصر است. علاوه بر این، عنصر به عنوان زمینه تابع (this) برای فراخوانی آن تنظیم می شود. این به تابع اجازه می دهد تا پردازش خود را برای هر عنصر خاص سفارشی کند - مزیت اصلی استفاده از این روش.

مثال استفاده به عنوان مقدار تابع متد .attr():

$("").attr("عنوان"، تابع(index، previousValue) (برگردان previousValue + "I am عنصر" + index + " و نام من " + (this.id || "unset"); )))

با این روش تمام عناصر HTML را در صفحه پیدا می کنیم که دارای ویژگی عنوان هستند و ویژگی هر عنصر را تغییر می دهیم. این تغییر با افزودن یک رشته ساخته شده با استفاده از شاخص عنصر در DOM و شناسه مشخصه هر عنصر خاص، در صورت وجود، یا در غیر این صورت یک رشته «unset» (به شما امکان می‌دهد تمام تنظیمات را بازنشانی کنید) به مقدار موجود رخ می‌دهد.

دومین استفاده از متد .attr() تنظیم/تغییر مقدار چندین ویژگی در یک زمان است.

سینتکس روشی که می تواند مقادیر چند ویژگی را به طور همزمان تغییر دهد

  • attr (ویژگی ها)
    • از خصوصیات و مقادیر مشخص شده توسط شی ارسال شده برای تنظیم ویژگی های مناسب در تمام عناصر مجموعه مربوطه استفاده می کند.
  • گزینه ها
    • نام— (رشته) نام صفتی که باید تنظیم شود.
    • ویژگی های- شیئی که خصوصیات آن به عنوان صفت برای همه عناصر مجموعه کپی می شود.
  • برمی گرداند
    • مجموعه جی کوئری

با استفاده از این گزینه، با استفاده از متد ()attr، می توانید خیلی سریع مقدار چندین ویژگی را در تمام عناصر یک مجموعه تغییر دهید یا تنظیم کنید. متد یک پارامتر می گیرد و باید یک شی باشد. ویژگی های شی نام ویژگی هایی هستند که می خواهیم با آنها کار کنیم.

مثال استفاده:

$("input").attr(( value: "", placeholder: "Search the site", title: "Please a value" ));

بیایید به مثال بالا نگاه کنیم. ما با تمام عناصر ورودی در صفحه هستیم و در صورت وجود، مقدار، مکان نگهدار و ویژگی های عنوان همه عناصر پیدا شده را تغییر می دهیم و در غیر این صورت، آنها را اضافه می کنیم.

هشدار

تغییر ویژگی نوع یک عنصر ورودی یا دکمه ای که از طریق متد document.createElement() ایجاد می شود منجر به یک استثنا در Internet Explorer 6 - 8 می شود.

آخرین به روز رسانی: 11/1/2015

در فصل قبل یاد گرفتیم که چگونه با استفاده از انتخابگرها و روش های مختلف عناصر را بدست آوریم، چگونه انتخاب را اصلاح کنیم و فقط عناصر لازم را در آن باقی بگذاریم. با این حال، اگر جی کوئری از دستکاری عناصر انتخاب شده پشتیبانی نمی کرد، خود انتخاب مهم نخواهد بود. بنابراین، بیایید ببینیم چه دستکاری هایی با عناصر می توانیم با استفاده از jQuery انجام دهیم.

ویژگی ها و ویژگی های عناصر

کتابخانه jQuery ابزارهایی را برای دستکاری خصوصیات و ویژگی های عناصر به ما ارائه می دهد. اما قبل از اینکه به روش های واقعی جی کوئری بروید، باید به تفاوت ویژگی ها و ویژگی ها توجه کنید.

ویژگی ها عناصر نشانه گذاری عناصر مانند id، style، class و تعدادی دیگر هستند. ویژگی ها عناصر اشیاء جاوا اسکریپت را نشان می دهند.

علیرغم این تفاوت، نگاشت بین ویژگی ها و ویژگی ها وجود دارد. بنابراین، ویژگی id با ویژگی id مطابقت دارد. به عنوان مثال، ما یک لینک داریم:

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

تغییر خواص

برای کار با خواص، جی کوئری یک متد prop() دارد. برای بدست آوردن مقادیر ویژگی، باید نام ویژگی را به این متد ارسال کنیم. به عنوان مثال، به این صورت می توانیم تمام آدرس های پیوند را در یک صفحه دریافت کنیم:

$("a").each(function(index,elem)(consol.log($(elem).prop("href")); ));

برای تغییر مقدار یک ویژگی، فقط باید مقدار جدید را به عنوان پارامتر دوم ارسال کنید:

$("a").first().prop("href","33.html");

حذف خواص

برای حذف ویژگی ها، می توانیم از روش removeProp("property_name") استفاده کنیم:

$("a").first().removeProp("href");

پس از این، به ویژگی یک مقدار جدید اختصاص داده می شود: undefined که نشان می دهد ویژگی تعریف نشده است.

کار با ویژگی ها

کار با ویژگی ها از بسیاری جهات شبیه کار با ویژگی ها است. بنابراین، برای بدست آوردن مقدار مشخصه یک عنصر، باید از متد attr("attribute_name") استفاده کنیم:

$("a").each(function(index,elem)(consol.log($(elem).attr("href")); ));

عملکرد این روش مشابه روشی است که برای متد prop داده شده است: تمام آدرس های پیوند را به کنسول خروجی می دهد.

و با ارسال یک مقدار به عنوان پارامتر دوم به متد attr، می توانید مقدار جدیدی برای ویژگی تعیین کنید:

$("a").first().attr("href","33.html");

و همچنین برای حذف مقادیر ویژگی، می توانیم از روش removeAttr("attribute_name") استفاده کنیم:

$("a").first().removeAttr("href");

لطفاً توجه داشته باشید که اگر در مورد حذف یک ویژگی از طریق روش removeProp، ویژگی مربوط به ویژگی باقی می‌ماند، فقط به آن مقدار خاصیت اختصاص می‌یابد، یعنی تعریف نشده است، پس هنگام حذف یک ویژگی با استفاده از removeAttr، ویژگی از آن حذف می‌شود. نشانه گذاری عنصر

ویژگی های سفارشی HTML5

HTML5 قابلیت هایی مانند ویژگی های سفارشی را معرفی کرد. ماهیت آنها این است که ما می توانیم ویژگی های اضافی را به یک عنصر اعمال کنیم، که مقداری اضافی را ذخیره می کند. ویژگی های مشابه با پیشوند شروع می شود داده ها-و به دنبال آن نام واقعی ویژگی و مقدار آن آمده است. به عنوان مثال، در مثال زیر یک ویژگی data-year اضافه می کنم که سال را ذخیره می کند:

  • جاوا
  • C/C++

برای کار با چنین ویژگی هایی از روش داده استفاده می شود. موارد استفاده زیر را دارد:

    data("نام ویژگی"): مقدار ویژگی اولین عنصر مجموعه را دریافت می کند. نام ویژگی بدون پیشوند به عنوان یک پارامتر ارسال می شود داده ها-

    بنابراین، می‌توانیم مقدار ویژگی را از مثال قبلی به صورت زیر دریافت کنیم:

    Console.log($("ul").data("year"));

    data(): یک شی جاوا اسکریپت را برمی‌گرداند که شامل مجموعه‌ای از ویژگی‌ها و مقادیر آن‌ها به‌عنوان جفت کلید-مقدار است.

    به عنوان مثال، فرض کنید یک عنصر با دو ویژگی داریم:

      سپس متد data() شیء را برمی گرداند (شرح:"lang"، سال:"2010"). و برای به دست آوردن مقدار یک ویژگی فردی، می توانید به صورت زیر بنویسید:

      Console.log($("ul").data().year);

      data("ویژگی"، "مقدار جدید"): مقدار مشخصه را به رشته ارسال شده به عنوان پارامتر دوم تنظیم می کند:

      $("ul").first().data("year", "2012");

      مقدار جدید همچنین می تواند یک شیء کامل جاوا اسکریپت باشد و این ویژگی کل این شی را به عنوان یک مقدار در بر خواهد داشت:

      $("ul").first().data("lang", ( rate: "tiobe"، سال: 2012 ));

    اگر بخواهیم یک ویژگی را حذف کنیم، برای انجام این کار باید از روش removeData("attribute_name") استفاده کنیم.

بهترین مقالات در این زمینه