• 締切済み

画面が遷移したみたいになってしまいます。

画面ロード後にjavascriptで動的にまたjavascriptタグを表示しています。 以下のjavascriptを組み込んでみたところ、取得したjavascriptを表示したときに画面遷移したみたいになってしまいました。 どうすればきちんと表示されるようになるでしょうか。 <div id="position"></div> <script language="javascript">// <!-- var timer = setInterval("Timer()", 1000); function Timer() { var position = document.getElementById('position'); var script = document.createElement('script'); script.setAttribute('type', 'text/javascript'); script.setAttribute('src', 'http://hogehoge/getjs'); position.appendChild(script); clearInterval(timer); } // --></script> http://hogehoge/getjsからはコンテンツの部品を表示するjavascriptが入っています。

みんなの回答

  • ANASTASIAK
  • ベストアンサー率19% (658/3306)
回答No.1

setAttributeを使っているときには環境を書いてもらわないと。 あと、それが原因かどうかは別として、エスケープの仕方がま ずいです。

Filette
質問者

お礼

ありがとうございます! 早速setAttributeを調べてみます。 エスケープとは文字列リテラルのところでしょうか ''

Filette
質問者

補足

自己解決しました。

関連するQ&A

  • DOMで作ったラジオボタンが選択できない

    JavaScript DOM で作成したラジオボタンが選択できません。 Sleipnirの「選択部分のソースを表示」で確認したところ、 name属性だけがセットされていないようで、選択できない原因はそれだと思いますが、 セットできない理由が分かりません。 どなたか解決策を教えて頂けないでしょうか。 なお、下記の何れの方法でもダメなようです。 obj.name = "hogehoge" obj.setAttribute("name", "hogehoge"); 念のため、現象確認用のソースも貼っておきます。 <html> <head> <script type="text/javascript"> function create1() { var rObj = document.createElement("input"); rObj.type = "radio"; rObj.name = "rd"; rObj.value = 5; var divObj = document.getElementById("box"); divObj.appendChild(rObj); } function create2() { var rObj = document.createElement("input"); rObj.setAttribute("type", "radio"); rObj.setAttribute("name", "rd"); rObj.setAttribute("value", "3"); var divObj = document.getElementById("box"); divObj.appendChild(rObj); } </script> </head> <body> <input type="button" value="create1" onClick="create1()"> <input type="button" value="create2" onClick="create2()"> <div id="box"></div> </body> </html>

  • 記述方法について

    よろしくお願いします。前回こちらで教えて頂いたソースを 基に表示するテーブルの並び方を変えたいと思っています。 理想の並び方は、例として くま さる           くま  さる ごりら  これらを→ごりら うま  うま           りす りす というように読み込んだエクセルのレコードを2列ずつにして表したいのですが、可能でしょうか? 以下のソースを基に、色々試したのですが、ブラウザ上には何も出てきません。 -------------------------------------------------------------- <html> <head> <title>TEST CSV IN</title> <script type="text/javascript"> function hoge(){ var TEST = document.getElementById("TEST"); var output = document.getElementById("OUTPUT"); var table = document.createElement("table"); table.setAttribute("border","1"); table.setAttribute("datasrc","#TEST"); var tbody = document.createElement("tbody"); var trs = new Array(); var tds = new Array(); TEST.Reset(); var rs = TEST.recordset; while (!rs.EOF){ var tbl = document.createElement("table"); table.setAttribute("border","1"); var td = document.createElement("td"); for(var i=1; i<2; i++){   var tr = document.createElement("tr");   trs[0] = document.createElement("tr");   trs[1] = document.createElement("tr");   trs[2] = document.createElement("tr"); tds[0] = document.createElement("td"); tds[1] = document.createElement("td"); tds[2] = document.createElement("td"); var img = document.createElement("img"); img.setAttribute("src",rs.fields(0)); img.setAttribute("alt",""); tds[0].appendChild(img); tds[1].innerText = rs.fields(1); tds[2].innerText = rs.fields(2); trs[0].appendChild(tds[0]); trs[1].appendChild(tds[1]); trs[2].appendChild(tds[2]); tr.appendChild(trs[0]); tr.appendChild(trs[1]); tr.appendChild(trs[2]); tbody.appendChild(tr); } rs.MoveNext; } table.appendChild(tbody); output.appendChild(table); } </script> </head> <body onload="hoge();"> CSV DATA IMPORT Ver MINO <p> <object id="TEST" classid="clsid:333C7BC4-460F-11D0-BC04-0080C7055A83"> <param name="DataURL" value="cn.csv" /> <param name="UseHeader" value="true" /> <param name="TextQualifier" value="'"> <param name="FieldDelim" value=","> </object> <div id="OUTPUT"> </div> </body> </html> ------------------------------------------------------------- javascriptを始めたばかりなので、まだよく理解していないので 大変申し訳ありませんが、ご指導願えればと思います。 よろしくお願いします。

  • jquery自体をJavaScriptで読み込む

    以下のようなものを想定して、jquery.js という中身がjqueryでないものから jqueryの実態を読み込みをさせようとしているのですが、うまくいきません。 ・jquery 2以降は、IE8以前をサポートしなくなるので、useragentで  読み込むjqueryを選択したい。 ・現在、CGIスクリプト上で、jqueryの読み込みを判断しているが、できれば  外部JavaScriptで巨大なjqueryの読み込みの判断をさせたい。 ・キャッシュされたとしても、ライブラリであることから、圧縮して70kバイトと  あまりにも巨大である ・(googleapiを利用すると、IE8以前では、プライバシーの警告が出る場合がある) 確かに、スマホにjqueryを普通に読み込ませても、何も問題なく動作しますが、 相当がんばって圧縮をしても70kバイト程度のライブラリを、使用しないのに 読み込むというのも気が引ける部分もあります。 何とか、動的に、かつ、何も問題なく、jqueryをJavaScriptで読み込む方法は あるでしょうか? このようなコードは、document.bodyがnullであるため、はじかれてしまいます。 var script = document.createElement('script'); script.src = 'http://hoge/jquery-1.js'; document.body.appendChild(script); var callee = arguments.callee; var interval = setInterval(function() { if (!document.evaluate) return; clearInterval(interval); interval = null; callee(); }, 100); このコードでも、jqueryを使用するものが、jQueryがないというエラーで、うまくいきません var scrptE = document.createElement("script"); scrptE.setAttribute("type", "text/javascript"); scrptE.setAttribute("language", "JavaScript"); scrptE.setAttribute("src", "http://hoge/jquery-1.js"); document.getElementsByTagName("head")[0].appendChild(scrptE); 以下のようなのは、googleapiのため、使わないものと考えます。 http://phpjavascriptroom.com/?t=ajax&p=jquery よろしくお願いします。

  • スクリプトで<div id="links">

    下記スクリプトで<div id="links"></div>のところを 開いた瞬間 <ul> <li><a href="http://foo.com/">foo</a></li> <li><a href="http://bar.com/">bar</a></li> </ul> に変換したいのですがうまくいきません どこをどのように変更すれば変換されるのでしょうか 【スクリプト】 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <script type="text/javascript"> var URL = new Array("http://foo.com/","http://bar.co.jp/"); var TITLE = new Array("foo","bar"); // 表示用コンテナ var container = document.getElementById('links'); // リセット container.innerHTML=''; var ul=document.createElement('ul'); container.appendChild(ul); for(var i=0;i<URL.length;i++){ var li=document.createElement('li'); var a=document.createElement('a'); // 'href'属性の設定 a.setAttribute('href',URL[i]); // ラベル a.appendChild(document.createTextNode(TITLE[i])); li.appendChild(a); ul.appendChild(li); } </script> </head> <body> <div id="links"></div> </body> </html>

  • JSONPを処理するにはどうすればいいですか?

    http://www.baldanders.info/spiegel/remark/archives/000222.shtml このページの下部のサンプルスクリプトを function getjsonp(url){ で囲ってurlを渡してJSONPデータを処理しようとしたのですが、 hundler is not defined とエラーが出てしまいます。 サンプルスクリプトのそのままのコードでは動くのです。 オブジェクト指向がよくわかっていないのでどうすればいいか、識者の方教えてください。 宜しくお願いします。 下記がエラーするスクリプトです。 <script type="text/javascript" src="/js/jsr_class.js"></script> <div id="bookmark"></div> <script type="text/javascript"> var url ='http://del.icio.us/feeds/json/spiegel?callback=hundler'; getjsonp(url); function getjsonp(url){ var oJsr = new JSONscriptRequest(url); oJsr.buildScriptTag(); oJsr.addScriptTag(); function hundler(data) { var ul = document.createElement('ul'); for (var i=0, post; post = data[i]; i++) { var li = document.createElement('li'); var a = document.createElement('a'); a.setAttribute('href', post.u); a.appendChild(document.createTextNode(post.d)); li.appendChild(a); ul.appendChild(li); } document.getElementById('bookmark').appendChild(ul); oJsr.removeScriptTag(); } } </script>

  • Apend前のElementの中のElement

    var div = document.createElement('div'); div.innerHTML="hogehoge<div id='hoge'>aaa</div>"; とし、 このdivの中のelementをID指定で取得したいです。 document.body.appendChild(div); とした後なら、 document.getElementById('hoge') で取得できるのですが、 appendChildしたくないです。 ご名案ありましたら、ご教授ください。宜しくお願いいたします。

  • 【javascript 文法】値渡し?参照渡し?

    以下実行すると、AAAをクリックしてもBBBをクリックしても「BBB」とアラートされます。 <html> <head> <script type="text/javascript" src="prototype.js"></script> </head> <body> <script type="text/javascript"><!-- var gDown= false; var div = document.createElement('div'); div.id = 'AAA'; div.innerHTML = 'AAA'; document.body.appendChild(div); Event.observe(div, 'mousedown',function(){ gDown = div; }); var div = document.createElement('div'); div.id = 'BBB'; div.innerHTML = 'BBB'; document.body.appendChild(div); Event.observe(div, 'mousedown',function(){ gDown = div; }); Event.observe(document, 'mouseup',function(){ alert(gDown.id); gDown=false; }); //--></script> </body> </html> javascriptって値渡しだと思っていたので、期待した動作と異なります。参照渡しだと考えると納得できるのですが、javascriptって 参照渡し?それとも値渡し? と混乱しています。 この辺のところを、教えてください。お願いいたします。

  • scriptリンクの別画面表示

    はじめまして。 ホームページのトップにブログの件名をニュースとして一覧表示したくて Google AJAX Feed API を利用しました。 表示自体はうまくいったのですが、 この記事へのリンクを別ウィンドウで開くようにするにはどうすればいいのでしょうか? 当方、JavaScriptは全く分からずで困っております・・・ おわかりの方、いらっしゃいましたらよろしくお願いいたします。 【html header 部分】 <script type="text/javascript" src="https://www.google.com/jsapi"></script> <script type="text/javascript"> google.load("feeds", "1"); function initialize() { var feed = new google.feeds.Feed("http://blog.XXXXX.XXX"); feed.load(function(result) { if (!result.error) { var container = document.getElementById("feed"); for (var i = 0; i < result.feed.entries.length; i++) { var entry = result.feed.entries[i]; var li = document.createElement("li"); var a = document.createElement("a"); a.href = entry.link ;       var date = new Date(entry.publishedDate); var titlelink = entry.title; a.appendChild(document.createTextNode( "・" + date.toDateString() + " " +titlelink)); li.appendChild(a); container.appendChild(li); } } }); } google.setOnLoadCallback(initialize); </script> 【html body 部分】 <div id="feed"></div> 以上、どうぞよろしくお願いいたします。

  • マウスポインタが砂時計に

    IE6で、以下のスクリプトを表示させると、 マウスカーソルが砂時計になって、チカチカします。 <script language="JavaScript"> var x = 10; function hogehoge() { document.getElementById('test').style.left = x + "px"; x++; } setInterval ( 'hogehoge()',50 ) ; </script> <div id="test">xxxx</div> チカチカしなくなるようにしたいのですが、方法が有りましたらご教授願います。 なお、オブジェクトはこれ以上軽くすることは出来ません。 よろしくお願いいたします。

  • color 属性が追加できない

    <html><meta><script language="javascript"><!-- tr = document.createElement("tr"); tr.setAttribute("bgcolor", "black"); td = tr.appendChild(document.createElement("td")); td.appendChild(document.createTextNode("test")); tbody1.appendChild(tr); //--></script></head><body> <table><tbody id="tbody1"></tbody></table> </body></html> というソースなのですが,実行してもセルの背景が黒く塗りつぶされません。 setAttribute("width", "100px")などはきちんと適用されるのですが・・・。 setAttribute("style", "background-color: black;")としてもダメでした。 どのようにすればよいのでしょうか。 よろしくお願いします。

専門家に質問してみよう