JQuery’de closest Metodu Kullanımı
Herkese merhaba,
Bu yazıda JQuery’de closest metodu kullanımı ile ilgili bilgi vermeye çalışacağım.
JQuery’de closest metodu seçtiğimiz elemanın belirttiğimiz seçici kuralına göre en yakın olan ebeveynini (kendisi de bu kontrole dahildir) bulur ve bize döner. Eğer bulamazsa null sonucunu bize döner
Aşağıdaki kodlar yardımıyla siz de bu işlemi rahatlıkla yapabilirsiniz.
HTML Kodu
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>JQuery’de closest Metodu Kullanımı</title>
</head>
<body>
<button>span etiketine en yakın div etiketini seç</button>
<div id="box">
<div>
div
<div>
div
<p>
p
<span>span</span>
</p>
</div>
</div>
</div>
</body>
</html>
CSS Kodu
body {
margin: 20px;
font-size: 18px;
}
#box * {
max-width: 500px;
display: block;
border: 2px solid blue;
color: black;
padding: 5px;
margin: 5px;
}
button {
padding: 12px;
margin-bottom: 18px;
background-color: red;
color: #fff;
border: none;
cursor: pointer;
font-size: 16px;
}
JQUERY Kodu
$(document).ready(function () {
$("button").click(function () {
$("span").closest("div").css({ "color": "red", "border": "3px solid red" });
});
});
Herkese çalışma hayatında ve yaşamında başarılar kolaylıklar.