Jquery İle Html Dom Elementlerinin İçeriğini Değiştirmek

  1. Ana Sayfa
  2. >
  3. Javascript
  4. >
  5. Jquery İle Html Dom Elementlerinin...


Bir önceki makalemizde dom öğelerini bulup yazı halinde yada html kodlarını’da dahil ederek alert fonksiyonu ile göstermiştik şimdi yine jquery yardımı ile yaptığımız bir önceki işlemden farklı olarak bu sefer elementi sadece bulmuyoruz bir de buna ek olarak bulunan öğenin içeriğini bizim belirlediğimiz şartlar doğrultusunda istediğimiz bir veri ile kolayca değiştireceğiz…

<!DOCTYPE html>
<html>
<head>
<script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js”></script>
<script>
$(document).ready(function(){
$(“button”).click(function(){ //Burada tıklama komutunu istediğiniz bir elemente atayabilirsiniz.
$(“h4”).html(“<b>Merhabalar Ben Bu Belgede Mevcut Olan Bütün H4 Elementlerinin İçeriğini Bulup Değiştirdim !</b>”); // Sistem Bulduğu Tüm H4 Elementlerinin İçeriğini Değiştirir.
});
});
</script>
</head>
<body>

<button>HEMEN DEĞİŞTİR</button>

<h1>Unutmayın Ki Başlık Etiketleri Sırasıyla Kullanılmalıdır: Yani: H1, H2, H3, H4, H5, H6 Gibi</h1>
<h2>Ben H2 Etiketiyim !</h2>
<h3>Ben H3 Etiketiyim !</h3>
<h4>Ben H4 Etiketiyim Haydi Beni Bul Ve Değiştir !</h4>

</body>
</html>

Demo: https://www.w3schools.com/code/tryit.asp?filename=FXM44WYH5SBN