WEBリソースの非同期読み込み
InternetExplorer.Applicationで読み込むのと違いCORSが利いてしまうので使いどころは限られるが、WEBアプリに近い書き方が出来るのが利点。ローカルシステムで使うには十分だろう。
サンプルではWikipediaのページを引っ張ってDOM操作を試みる。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script language="JavaScript">
function addText(html) {
document.getElementById('result').innerHTML += html + '<br>';
}
function loadHTML(keyword) {
var http = new XMLHttpRequest();
http.onreadystatechange = function () {
if (http.readyState != 4 || http.status != 200)
return;
var htmlDOM = new ActiveXObject('htmlfile');
htmlDOM.write(http.responseText);
addText(htmlDOM.getElementById('firstHeading').innerHTML);
};
http.open('GET', 'https://ja.wikipedia.org/wiki/' + encodeURIComponent(keyword), true);
http.send(null);
}
window.addEventListener('load', function () {
addText('load 私');
loadHTML('私');
addText('load あなた');
loadHTML('あなた');
addText('load アルファ');
loadHTML('アルファ');
addText('load オメガ');
loadHTML('オメガ');
});
</script>
<title>wikipedia</title>
</head>
<body>
<div id="result"></div>
</body>
</html>
なお、Wikipediaの情報が必要な場合は、MediaWiki APIを使って、jsonやXMLで取得した方が良いだろう。
追記:2020-01-27
当初、XMLHttpRequestを使用すると未定義エラーが出ていた為、ActiveXObject('Msxml2.XMLHTTP')を指定していたが、今試すと全く問題なく使えたのでXMLHttpRequestを使用するように訂正。