- 締切済み
JavaScripty変数をHTMLで利用
御教示くださいませ。 JavaScriptで作成した変数をHTML内で利用したいと思います。 HTML内での利用の際、document.writeや、getElementByIdなどは利用しない方法がないかと 模索しております。 以下が実装したい例です。 ※一部記載省略 ------------------ <script> var yourname = "山田"; var param = "abc"; </script> <body> あたなの名前は●です。 <a href="./index.php?room=■">コチラ</a>から。 </body> ------------------ ●には山田、 ■にはabc と表示させたいと考えております。 お忙しいところ申し訳ありませんが、御教示のほどお願いいたします。
- urotsuta987
- お礼率0% (0/4)
- JavaScript
- 回答数4
- ありがとう数4
- みんなの回答 （4）
- 専門家の回答
みんなの回答
- Ogre7077
- ベストアンサー率65% (170/258)
JavaScript変数 は JavaScript でしか使えないので、 せめてテンプレートっぽく記述しては如何でしょう。 <script>(function(){ // 変数の定義 var templeVars = { yourName: [ 'textContent', "山田"], param: [ 'href', "abc"], }; addEventListener('load', function(ev){ // テンプレXXXを変数の内容に置換 for (i in templeVars) { var d = templeVars[i], s = document.getElementById(i); s[d[0]] = s[d[0]].replace('XXX', d[1]); } }, false); })()</script> <body> あなたの名前は<span id=yourName>XXX</span>です。 <a href="./index.php?room=XXX" id=param>コチラ</a>から。
WPFでいうところのデータバインドをHTMLでも実現させたいということでよろしいでしょうか？ でしたら、jQuery Templateを使えば似たようなことができます <script> $('#tmpl_info').tmpl({ name: '山田',param: 'abc' }).appendTo('#main'); </script> <script id="tmpl_info" type="text/x-jquery-tmpl"> あたなの名前は${name}です。 <a href="./index.php?room=${param}">コチラ</a>から。 </script> <body id="main"> </body>
- Bnbnbnta101
- ベストアンサー率7% (41/516)
何がしたいのかよくわかりません。 writeなどを使用したくない理由はなんですか？
- Picosoft
- ベストアンサー率70% (274/391)
> JavaScriptで作成した変数をHTML内で利用したいと思います。 そういうときのためのdocument.writeやgetElementByIdですが……。
