Forked from: djakarta-trap's 掌田津耶乃(7歳)から学ぶJS DOM その1 diff(11) forked from: 掌田津耶乃(7歳)から学ぶJS DOM その1 djakarta-tra.. Follow 2010-07-26 23:39:45 License: MIT License Fork1 Fav0 View577 "掌田津耶乃(7歳)から学ぶJS DOM その3" Play Stop Reload Fullscreen Smart Phone Fork tree Readme JavaScript 21 lines HTML 8 lines CSS 1 lines "掌田津耶乃(7歳)から学ぶJS DOM その3" forked from: 掌田津耶乃(7歳)から学ぶJS DOM その1 // "掌田津耶乃(7歳)から学ぶJS DOM その3" // 大体88ページあたり document.getElementById("content").innerHTML = "サンプルです"; //<html>...</html>がはいった、Documentクラスのインスタンス(オブジェクト) console.log("hoge = "+document.getElementById("content")); //<body>...</body>そのものが返ってきてる。 //だから、document.body.p とか、APIをたどっていくような処理はできない。 //getElementById してやる必要がある。 console.log(document.body); // だから、undefinedが返る。 console.log(document.body.p); function doAction(){ console.log(document.getElementById("input")) document.getElementById("content").innerHTML = document.getElementById("input").value; } <h1 id="title">yes we can</h1> <p id="content">obama</p> <input type="text" id="input" /> <br /> <!-- void(0)は、空撃ち関数。 onClick参照は、クリックされた時のハンドラ的な。 --> <a href="javascript:void(0)" onClick="doAction();">click me !</a> forked from: 掌田津耶乃(7歳)から学ぶJS DOM その1 body { background-color: #DDDDDD; } "掌田津耶乃(7歳)から学ぶJS DOM その3" // "掌田津耶乃(7歳)から学ぶJS DOM その3" // 大体88ページあたり document.getElementById("content").innerHTML = "サンプルです"; //<html>...</html>がはいった、Documentクラスのインスタンス(オブジェクト) console.log("hoge = "+document.getElementById("content")); //<body>...</body>そのものが返ってきてる。 //だから、document.body.p とか、APIをたどっていくような処理はできない。 //getElementById してやる必要がある。 console.log(document.body); // だから、undefinedが返る。 console.log(document.body.p); function doAction(){ console.log(document.getElementById("input")) document.getElementById("content").innerHTML = document.getElementById("input").value; } <h1 id="title">yes we can</h1> <p id="content">obama</p> <input type="text" id="input" /> <br /> <!-- void(0)は、空撃ち関数。 onClick参照は、クリックされた時のハンドラ的な。 --> <a href="javascript:void(0)" onClick="doAction();">click me !</a> body { background-color: #DDDDDD; } use an iframe compat browser, deer Tweet QR code Embed Design view Code view <script type="text/javascript" src="http://jsdo.it/blogparts/z2Sw/js?view=design"></script><p class="ttlBpJsdoit" style="width: 465px; margin: 0; text-align: right; font-size: 11px;"><a href="http://jsdo.it/djakarta-trap/z2Sw" title="forked from: 掌田津耶乃(7歳)から学ぶJS DOM その1">forked from: 掌田津耶乃(7歳)から学ぶJS DOM その1 - jsdo.it - share JavaScript, HTML5 and CSS</a></p> zip tags Tweet twitter Forked sort new page view favorite forked 掌田津耶乃(7歳)から学ぶJS DOM その4 djakarta-tra.. 20 849views 39/13/1 掌田津耶乃(7歳)