参考
Amazon CAPTCHA
昔買った本で勉強
メモ
JavaScriptが扱うオブジェクトは4つあり。
①JavaScript固有オブジェクト
<html>
<head>
<title>Test</title>
</head>
<body>
<script type="text/javascript">
function hoge() {
this.height = 100;
this.width = 200;
}
var myobj = new hoge();
alert(myobj.height);
hoge.prototype.depth = 300;
alert(myobj.depth);
hoge.prototype.width = 400;
alert(myobj.width);
</script>
</body>
</html>
②ブラウザオブジェクト
<html>
<head>
<title>Test</title>
<script type="text/javascript">
function hoge() {
document.getElementById("fuga").style.backgroundColor = "#AAA";
}
</script>
</head>
<body onClick="hoge()">
<h1 id="fuga">honya</h1>
</body>
</html>
③ライブラリ提供オブジェクト
実行するとCORSエラーになる。(Google Chrome Developer Toolエラー)
Access to XMLHttpRequest at 'http://dicom.nema.org/medical/dicom/current/source/docbook/part01/part01.xml' from origin 'http://localhost:63342' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
FireFoxの"CORS Anywhere"拡張プラグインで表示可能。
<html>
<head>
<title>Test</title>
<script src="https://ajax.googleapis.com/ajax/libs/prototype/1.7.2.0/prototype.js" type="text/javascript"></script>
<script type="text/javascript">
function hoge(uri) {
target = "disp";
new Ajax.Updater(target, uri, {method: "get"});
}
</script>
<style type="text/css">
#disp{border: 1px solid #aaa;width: 250px; height: 250px; padding: 5px;}
</style>
</head>
<body>
<form>
<input type="button" id="btn01" name="btn01" value="No.1" onClick="hoge('http://dicom.nema.org/medical/dicom/current/source/docbook/part01/part01.xml')">
<input type="button" id="btn02" name="btn02" value="No.2" onClick="hoge('http://dicom.nema.org/medical/dicom/current/source/docbook/part02/part02.xml')">
</form>
<div id="disp"></div>
</body>
</html>
④JSONオブジェクト
<html>
<head>
<title>Test</title>
<script type="text/javascript">
var myJSON = {apple:"APPLE", banana:"BANANA"}
</script>
</head>
<body>
<form>
<input type="button" value="hoge" onClick="alert(myJSON.apple);">
</form>
</body>
</html>
