ponpon作Ajaxエンジンのダウンロードと解説

メモ

自作エンジンを paella（パエリア）と名付けました。（語呂が良かったので）
時々更新されます。IE / Firefox / Opera で動作検証済み。
ただし、Opera では一部機能が制限されます。
使用するには、ダウンロードした後、paella.js を読み込むだけでＯＫ。
苦情・要望・不具合報告はBBSへ。

使用例

<script src="./js/paella.js" type="text/javascript"></script>

解説

pXmlHttp

解説

XMLHttpRequest を使用出来るようにする為の宣言。
（動作検証 IE / Firefox / Opera）

使用例サンプル

var xmlhttp = new pXmlHttp();

メソッド

解説

テキスト形式でファイルを読み込み、指定の <div> にそのまま表示する。
url には、読み込みたいファイルの URL (URI) を、
div には、表示させたい <div> の ID を入力する。

使用例サンプル

var xmlhttp = new pXmlHttp();
xmlhttp.getHtml("./sample001.txt", "disp");

解説

テキスト形式でファイルを読み込み、指定の <div> にテキストとして表示する。
HTML タグも文字として表示させたい時などに使用。
ファイル中の改行は <br /> タグに変換、スペース（空白）も反映させる。
url には、読み込みたいファイルの URL (URI) を、
div には、表示させたい <div> の ID を入力する。

使用例サンプル

var xmlhttp = new pXmlHttp();
xmlhttp.getHtmltoText("./sample001.txt", "disp");

解説

XML 形式でファイルを読み込む。読み込んだ XML データを引数として fnc で指定した関数を実行する
url には、読み込みたいファイルの URL (URI) を、
fnc には、XML データを処理する関数の名前を設定する。

使用例サンプル

function onLoad() {
  var xmlhttp = new pXmlHttp();

  xmlhttp.getXml("./sample001.xml", display);
}
function display(xml) {
  if(xml) {
    window.alert(xml.documentElement.nodeName);
  }
}

解説

テキスト形式でファイルを読み込む。読み込んだテキストを引数として fnc で指定した関数を実行する
url には、読み込みたいファイルの URL (URI) を、
fnc には、XML データを処理する関数の名前を設定する。
サンプルでは、読み込んだテキストを１行ずつ配列にし、最初の行を表示している。

使用例サンプル

function onLoad() {
  var xmlhttp = new pXmlHttp();

  xmlhttp.getText("./sample003.txt", display);
}
function display(txt) {
  if(txt) {
    var reg;
    var spStr
    var disp = document.getElementById("disp");

    reg = new RegExp("\r\n|\r|\n", "g");
    spStr = txt.split(reg);

    disp.innerHTML = spStr[0];
  }
}

解説

データを送信し、処理結果を表示する。
url には、データの送信先の URL (URI) を、
frm には、送信するデータの <form> タグの名前、
div には、送信後、戻ってくるデータの表示先の <div> タグを指定する。
指定した <form> タグ内の全データが送信される。

使用例サンプル

var xmlhttp = new pXmlHttp();
xmlhttp.setMethod("post");
xmlhttp.send("./sample001.php", document.frm, "disp");

静的メソッド

解説

XMLHttpRequest を単独で取得する。
取得後は自由に使用可能。

使用例サンプル

var xmlhttp = pXmlHttp.xmlhttp();
if (xmlhttp) {
  xmlhttp.open("GET", "./sample001.txt");
  xmlhttp.onreadystatechange = function() {
      if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
          var disp = document.getElementById("disp");
          disp.innerHTML = xmlhttp.responseText;
      }
  }
  xmlhttp.send(null);
}

静的メソッド

解説

送受信方式を取得する。

使用例サンプル

xmlhttp.open("GET", "./sample001.txt", "True");
xmlhttp.onreadystatechange = function() {
  if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
    var disp = document.getElementById("disp");
    disp.innerHTML = xmlhttp.responseText;
  }
}
xmlhttp.send(null);

解説

送受信方式（ "GET"｜"POST"｜"PUT"｜"PROPFIND" ）の設定。
method に送受信方式を入力。
"GET" / "POST" / "PUT" / "PROPFIND" 以外だと変化無し。

使用例サンプル

var xmlhttp = new pXmlHttp();
xmlhttp.setMethod("POST");

pXslt

解説

XSLT を使用出来るようにする為の宣言。
（動作検証 IE / Firefox ）

使用例サンプル

var xslt = new pXslt();

メソッド

解説

XSLT ファイルを XML 形式でファイルを読み込む。
url には、読み込みたいファイルの URL (URI) を入力する。
サンプルでは、指定した XSLT ファイルを読み込んで、、
getXml で読み込んだ XML データに適用している。

使用例サンプル

var xslt = new pXslt();
var xsltDoc;
xsltDoc = xslt.load("./sample001.xsl")

解説

XML データに XSLT を反映して変換し、指定の <div> に表示する。
xmlDoc には、XML 形式のデータ（ getXml で読み込んだデータ等）を入力、
div には、表示させたい <div> の ID を入力する。
xsltDoc には、XML 形式またはテキスト形式の XSLT を入力する。
サンプルでは、テキスト形式（文字列）で記述した XSLT を、
getXml で読み込んだ XML データに適用している。

使用例サンプル

var xslt = new pXslt();
var xsltDoc;

xsltDoc = '<?xml version="1.0" encoding="utf-8"?>';
xsltDoc = xsltDoc + '<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">';
...省略...
xsltDoc = xsltDoc + '</xsl:template></xsl:stylesheet>';

xslt.asynchronousTransform(xml, "disp", xsltDoc);

解説

`pXmlHttp`

メソッド

静的メソッド

静的メソッド

`pXslt`

メソッド