آموزش جی کوئری – حذف محتوا در jQuery

  • آپدیت شده در تاریخ

آموزش جی کوئری

در بخش قبلی با افزودن محتوا در jQuery آشنا شدیم. در این قسمت از سری آموزش جی کوئری, نحوه حذف المان های HTML یا محتوا و خصوصیات آن ها در سند با استفاده از جی کوئری می پردازیم.

 

حذف محتوا یا المان ها با jQuery

جی کوئری متدهای انگشت شماری مثل empty(), remove(), unwrap() و .. را برای حذف المان های HTML یا محتوای آن ها از سند ارایه داده است.

 

متد empty() جی کوئری

متد empty() در جی کوئری همه المان های فرزند با دیگر فرزندان و محتوای متنی داخل المان های انتخاب شده از DOM را حذف می کند.

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

نکته: بر اساس مشخصات DOM در کنسرسیوم جهانی وب W3C , هر رشته از متن داخل یک المان به عنوان گره (node) فرزند آن المان درنظر گرفته می شود.

 

متد remove() جی کوئری

متد remove() در جی کوئری همه المان های انتخابی از DOM و همه چیز داخل آن را پاک می کند.

به علاوه خود المان ها, همه رویدادهای محدود و داده های jQuery اختصاص داده شده به المان ها نیز حذف می شوند.

مثال زیر همه المان های <p> با کلاس .hint را از DOM با کلیک روی دکمه حذف می کند. المان های تو در تو داخل پاراگراف ها نیز حذف خواهد شد.

متد remove() در جی کوئری می تواند شامل یک سلکتور به عنوان پارامتر اختیاری باشد که به شما اجازه می دهد المان هایی که باید حذف شوند را فیلتر کنید.

برای نمونه, مثال قبلی را بصورت زیر بازنویسی می کنیم :

نکته : همچنین می توانید سلکتور را به عنوان یک پارامتر داخل متد remove() مثل remove(".hint, .demo") برای فیلتر چندین المان استفاده کنید.

 

متد unwrap() جی کوئری

متد unwrap() در جی کوئری همه المان های والد از المان های انتخابی را حذف می کند. این متد برعکس متد wrap() در آموزش قبلی است.

مثال زیر به شما حذف المان والد المان های <p> را با دکمه کلیک نمایش می دهد.

 

متد removeAttr() جی کوئری

متد removeAttr() در جی کوئری یک خصوصیت را از المان های انتخابی حذف می کند.

مثال زیر خصوصیت href را از المان های <a> با کلیک روی دکمه حذف می کند.

 

امیدوارم در این بخش آموزش جی کوئری, از حذف محتوا در jQuery نهایت استفاده را برده باشید.

در بخش بعدی با نحوه دستکاری کلاس CSS با jQuery , آشنا می شوید.

هر سوالی داشتید ، از قسمت نظرات ارسال کنید . سریعا ، پاسخگوی سوالات شما هستیم .

موفق باشید

حسن شفیعی علاقه خاصی به برنامه نویسی وب و موبایل دارم و هر روز تلاش می کنم به این حوزه مسلط تر شوم و اطلاعاتم را به شکل کاربردی برای علاقه مندان در وب به اشتراک بگذارم

آموزش های رایگان بیشتر در اینستاگرام ما ...

NETPARADIS /
دیدگاه کاربران

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

    دوره های آموزشی