jQuery Ajax Sample - dataType

[dataType: "script"] Javascriptを読み込み実行する

jQuery

1
2
3
4
5
6
7
$(function() {
  $.ajax({
    type: "GET",
    url: "sample1.js",
    dataType: "script"
  });
});

sample1.js

1
$("#ajax1").html('これはsample1.jsで挿入された文字列です').css({'color':'red'});

[dataType: "html"] HTMLファイルを読み込む

これはhtml.html内で実行されたjavascriptの内容です

jQuery

1
2
3
4
5
6
7
8
9
10
$(function() {
  $.ajax({
    url: "html.html",
    dataType: "html",
    }).done(function(html){
      $("#ajax2").html(html);
    }).fail(function(html){
      $("#ajax2").html('読み込みエラーです');
    });
});

html.html

1
2
3
4
<div style="color: blueviolet">これはhtml.htmlの内容です</div>
<script>
  $("#ajax2").append('これはhtml.html内で実行されたjavascriptの内容です');
</script>

[dataType: "xml"] xmlファイルを読み込む

jQuery

1
2
3
4
5
6
7
8
9
10
11
$(function() {
  $.ajax({
    url: "xml.xml",
    dataType: "xml",
    }).done(function(xml){
      var text = $(xml).find("data").text();
      $("#ajax3").text( text ).css({'color':'red'});
    }).fail(function(xml){
      $("#ajax3").html('読み込みエラーです');
    });
});

xml.xml

1
2
3
<xml>
  <data>これはxml.xmlから得たデータです</data>
</xml>