متدهای parent و parents و parentsUntil در جی کوئری

هدایت عباسی آموزش جی کوئری

آموزش ویدئویی متدهای parent و parents و parentsUntil در جی کوئری

دانلود فیلم و آموزش ویدئویی متدهای parent و parents و parentsUntil در جی کوئری. در این فیلم با این دستورات آشنا می شوید و نحوه کار با آنها را فرا می گیرید.

چنانچه مشکلی در اجرای فیلم دارید از مرورگر فایرفاکس استفاده نمایید یا روی لینک زیر کلیک نمایید.

مشاهده یا دانلود فیلم بالا

در این بخش از آموزش جی کوئری از تاپ سایت 98 قصد داریم به آموزش متدهای parent و parents و parentsUntil در جی کوئری بپردازیم. با ذکر چندین مثال متدها و دستورات را یاد خواهید گرفت.

توجه : کدها همه تست شده می باشد و کاملا صحیح است. چون از cdn استفاده شده باید به اینترنت متصل باشید. در غیر این صورت کد اجرا نخواهد شد.

خطا

چون از cdn استفاده شده باید به اینترنت متصل باشید. در غیر این صورت کد اجرا نخواهد شد.

در صورتی که کد بالا اجرا نمی شود می توانید بجای cdn از فایل جی کوئری استفاده نمایید.

بایستی فایل جی کوئری را دانلود کرده باشید.

آموزش دانلود جی کوئری

متد parent در جی کوئری

متد parent در جی کوئری پدر عنصر انتخاب شده را مشخص می کند.

در مثال زیر span را انتخاب کردیم. پدر span عنصر li است. به همین خاطر دور آن کادری آبی رنگ انداختیم تا ابتدا آن را ببینید.

حال پدر آن را مشخص کرده و سپس کادر آن را تغییر می دهیم.

مثال

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("span").parent().css({"color": "red", "border": "3px solid red"});
});
</script>
</head>
<body>

<div>
<h1>topsite98.com</h1>
<ul>
<li><b>ali</b></li>
<li style="border: 1px solid blue"><span>reza</span></li>
</ul>
</div>
</body>
</html>

متد parents در جی کوئری

متد parents در جی کوئری ، پدران عنصر انتخاب شده را مشخص می کند.

در مثال زیر پدران عنصر span را مشخص می کنیم. پدران span عناصر li , ul , div می باشد.

مثال

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("span").parents().css({"color": "red", "border": "3px solid red"});
});
</script>
</head>
<body>

<div>
<h1>topsite98.com</h1>
<ul>
<li><b>ali</b></li>
<li style="border: 1px solid blue"><span>reza</span></li>
</ul>
</div>
</body>
</html>

متد parentsUntil در جی کوئری

متد parentsUntil در جی کوئری ، پدران عنصر انتخاب شده را تا قبل از عنصر مشخص شده ، مشخص می کند.

در مثال زیر پدران عنصر span را تا قبل از div مشخص می کنیم. پدران span عناصر li , ul می باشد.

مثال

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("span").parentsUntil("div").css({"color": "red", "border": "3px solid red"});
});
</script>
</head>
<body>

<div>
<h1>topsite98.com</h1>
<ul>
<li><b>ali</b></li>
<li style="border: 1px solid blue"><span>reza</span></li>
</ul>
</div>
</body>
</html>

برای دیدن همه آموزش های جی کوئری کلیک کنید : آموزش کامل جی کوئری به زبان فارسی

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

موفق باشید.

اگر به دنبال کار پاره وقت هستید با ما تماس بگیرید.

اگر سوال یا نظری دارید در بخش کامنت ها بنویسید.اگر موضوع خاصی مد نظر شماست که در سایت موجود نیست در بخش کامنت ها بنویسید