jQuery XML Okuma

Yazıda JavaScript işlemlerini kolaylaştıran jQuery kütüphanesi ile XML okuma ve diğer işlemlerle ilgili bilgiler yer almaktadır.

jQuery içerisindeki ajax metodu AJAX isteklerini kolay bir şekilde yapılmasına imkan verir.

Metot içerisine sadece gerekli parametrelerin yazılmasıyla XML okuma işlemi yapılmış olur.

Kişi listesinin olduğu kisiler.xml dosyasından kişileri listeleyelim.

<?xml version="1.0" encoding="UTF-8"?>
<kisiler>
  <kisi>
    <sira>1</sira>
    <adi>Yusuf</adi>
    <soyadi>SEZER</soyadi>
  </kisi>
  <kisi>
    <sira>2</sira>
    <adi>Ramazan</adi>
    <soyadi>SEZER</soyadi>
  </kisi>
  <kisi>
    <sira>3</sira>
    <adi>Sinan</adi>
    <soyadi>SEZER</soyadi>
  </kisi>
  <kisi>
    <sira>4</sira>
    <adi>Mehmet</adi>
    <soyadi>SEZER</soyadi>
  </kisi>
</kisiler>

Dosya isminin url parametresine yazılması yeterli olacaktır.

<script>
"use strict";
  $(function () {

    $.ajax({
      url: "kisiler.xml",
      type: "GET",
      dataType: "xml",
      success: function (e) {

        // işlemler

      },
      error: function (e, b) {
        console.log(e + " " + b)
      }
    });

  });
</script>

jQuery XML işlemlerinde JavaScript XML Okuma ve JavaScript XML Listeleme yazılarında kullanılan yöntemler kullanılabilir.

Ayrıca jQuery içerisinde kullanılan html, text, eq, children gibi metotlarda kullanılabilir.

XML dosyasındaki ilk kişinin adı ve soyadını alalım.

<script>
"use strict";
  $(function () {

    $.ajax({
      url: "kisiler.xml",
      type: "GET",
      dataType: "xml",
      success: function (e) {

        var adiSoyadi = $("kisi > adi", e).eq(0).text();
        adiSoyadi += " " + $("kisi > soyadi", e).eq(0).text();

        $("body").append(adiSoyadi);

      },
      error: function (e, b) {
        console.log(e + " " + b)
      }
    });

  });
</script>

jQuery içerisinde sıklıkla kullanılan jQuery each metodu ile döngü kurarak XML içerisinde tekrar eden veriler ile işlem yapılabilir.

<script>
"use strict";
  $(function () {

    $.ajax({
      url: "XML_dosyasi.xml",
      type: "GET",
      dataType: "xml",
      success: function (e) {

        $("kisi", e).each(function (i, v) {

          var eleman = "";

          eleman = $("sira", v).text() + " ";
          eleman += $("adi", v).text() + " ";
          eleman += $("soyadi", v).text() + "<br />";

          $("body").append(eleman);

        });

      },
      error: function (e, b) {
        console.log(e + " " + b)
      }
    });

  });
</script>

jQuery içerindeki diğer metotları kullanarak farklı XML işlemleri yapabilirsiniz.

Hayırlı günler dilerim.

Yusuf SEZER

Yusuf SEZER

Computer Engineer who interested about web technologies, algorithms, artificial intelligence and embedded systems; constantly exploring new technologies.


Bunlara'da bakmalısın!