HTML KODLARI
<html>
<head>
<title>JQuery Komutlari</title>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script>
$(document).ready(function(){
$(".btn1").click(function(){
$("img").attr("width","500");
});
}); //nesnenin öznitelik özelliklere ulaşıp değiştirmeye yarar.
$(document).ready(function(){
$(".btn2").click(function(){
$("p:first").addClass("ezgi");
});
});//nesneye daha önceden tanımlı bir sınıf ekler.
$(document).ready(function(){
$(".btn3").click(function(){
$("p:first").removeClass();
});
});//nesnenin stil sınıfını kaldırır.
$(document).ready(function(){
$(".btn4").click(function(){
$("p").css("background-color","yellow");
});
});//stil,css özlelliklerini değiştirir.
$(document).ready(function(){
$(".btn5").click(function(){
$("p:first").remove();
});
});// nesneyi tamamen kaldırır.
$(document).ready(function(){
$(".btn6").click(function(){
$("p:first").append("<b>yine bennn:)</b>");
});
});//sona ekle
$(document).ready(function(){
$(".btn7").click(function(){
$("p:last").prepend("<b>yine yeni yeniden:)</b> ");
});
});//öne ekle
$(document).ready(function(){
$(".btn8").click(function(){
$("p").html(" <b> Ezgi Fidan</b>");
});
});//html içeriğini görüntüleyip değiştirmeye yarar.
$(document).ready(function(){
$(".btn9").click(function(){
$("input:text").val("Ezgi Fidan");
});
});//nesnenin varsa value değerini almaya ve değiştirmeye yarar.
$(document).ready(function(){
$(".btn10").click(function(){
alert($("p:first").hasClass(".fidan"));
});
});//nesneye sınıf eklimi kontrolü yapar.
</script>
<style>
.ezgi{font-size:150%;color:white;}
.fidan{font-size:150%;color:white;}
</style>
</head>
<body>
<h2>TANSU EZGI FIDAN</h2>
<p style="background-color:red">Tansu Ezgi Fidan</p>
<p style="background-color:orange">Bilgisayar Muhendisligi</p>
<p style="background-color:yellow">Ataturk Universitesi</p>
<img src="eifel.jpg" alt="Pulpit Rock" width="284" height="213">
<br></br>
<p>Name: <input type="text" name="user"></p>
<br></br>
<button class="btn1">attr</button>
<button class="btn2">addClass</button>
<button class="btn3">removeClass</button>
<button class="btn4">css</button>
<button class="btn5">remove</button>
<button class="btn6">append</button>
<button class="btn7">prepend</button>
<button class="btn8">html</button>
<button class="btn9">val</button>
<button class="btn10">hasclass</button>
</body>
</html>
EKRAN ÇIKTILARI
attr() sayesinde resim genişledi.
addClass() sayesinde ilk paragrafa sınıf ekledi.
removeClass() sayesinde ekli olan sınıf silindi.
css() sayesinde paragraflara yeni renk verildi.
remove() sayesinde ilk paragraf silindi.
append() sayesinde sona değer eklendi.
prepend()sayesinde öne değer eklendi.
html() son paragraftaki içeriği değiştirdi.
val() buton değerini verdi.
hasClass() sayesinde uygulanan nesnenin clası varsa trua yoksa false döndürür.
