DOM操作でobjectを生成する方法とは?

このQ&Aのポイント
  • DOM操作を使用してobject要素を生成する方法を教えてください。
  • ブラウザによってappletタグが非推奨となったため、DOM操作でobject要素を生成する方法を知りたいです。
  • object要素を生成するためのJavaScriptコードを試しましたが、classidが反映されませんでした。
回答を見る
  • ベストアンサー

DOM操作でobjectを生成したいのですが、どうしたらよいのでしょうか?

初めての質問なので上手く説明出来ていないかもしれませんが、 appletを非推奨タグだと知り、ブラウザによって区別して、 DOM操作によってobjectを生成したいのですが、何度やっても上手く行きません。 上手い生成方法を知っている方は教えていただけないでしょうか? 私のやってみたコードでは以下の様になり、 function addParent(_pid) { var element = document.createElement('object'); element.id = ParentID; element.classid = 'java:MasaoConstruction.class'; element.type="application/x-java-applet" element.archive='mc_c.zip,';//mc_c.zipの配置箇所 var objBody = document.getElementById(_pid); objBody.appendChild(element); //IDが_pidのものにIDが_midのObjectエレメントを追加する。 } これによって <object type="application/x-java-applet" archive='mc_c.zip,' id="*****"> </object> の様なものが出来て、classidが反映されませんでした。

  • juner
  • お礼率37% (3/8)

質問者が選んだベストアンサー

  • ベストアンサー
回答No.1

うーんと、俺classファイルをアーカイブに入れたこと無いし,実験方法もしらないので自信が無いのだけれど回答してみる。 Interfaceを実際にクラスで使ったことがあれば読めると思うんで説明省略 するけど DOM Level 2 HTMLを見ると http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-58190037 http://www.w3.org/TR/DOM-Level-2-HTML/html.html#ID-9893177 【Interface HTMLObjectElementにはclassidプロパティが定義されていない】 みたいなんだよね HTML 4.01の仕様では一応定義されていて http://www.w3.org/TR/1999/REC-html401-19991224/struct/objects.html#edef-OBJECT >classid = uri [CT] This attribute may be used to specify the location of an object's implementation via a URI. この属性は,実装されたオブジェクトの場所をURIによって指定するために用いられる。 It may be used together with, or as an alternative to the data attribute, depending on the type of object involved. これはdata属性と共に,もしくはdata属性の代わりとして objectに応じて使い分けられる と書いてある。 classid属性の代わりにdata属性を使ってみたら動くだろうか?

juner
質問者

お礼

あ、補足でやってしまいましたが… えっと…有難う御座います。お陰で踏ん切りが付きました。 とりあえずinnerHTMLでやってみることに方向転換する事にしました。

juner
質問者

補足

有難う御座います。 しかしながらclassidの代わりにしてdata属性を使うと……動きませんでした。 その為、私はinnerHTML使って直接文字列として書き込む事にしました。 どうも教えていただき有難う御座います。 助かりました。

関連するQ&A

  • object 要素貼り込みのアプレットがいつからか動作しなくなった

     Windows XP(SP2)の Internet Explorer 6 で,object 要素で貼り込んでいた Java アプレットが,いつの間にか動作しなくなっていました。  サーバ上のファイルは操作しておらず,クライアント側で行った操作は Windows Update くらいです。  Internet Explorer で MSJVM を使用しています(MSJVM 上で動作させる必要があります)。Windows XP は,初期版に SP2 を適用させたもので,MSJVM は存在しています。  アプレット貼り込みに使ったコードは, <object codetype="application/java" classid="java:***.class" width="500" height="320"></object> (「***」はクラス名)です。これに,codebase 属性を加えても,classid 属性を「java:***」「***」「***.class」にしても症状は同様でした。  少なくとも半年前(2005 年 9 月ごろ)までは,この記述で動作していました。この時点では,コンソールにエラーなどは出ていません。  現在は,クラスファイルをローカルに置き,jview /a でクラスファイルを指定すれば動作することは確認しています。  applet 要素を使用すれば貼り込めますが,事情によりこれは使えません。  以上より,対策等ご存じでしたら,ご教示願えますでしょうか。  また,心当たりとして「Windows Update」があるわけですが,もし,これにより標記の現象が生じてしまうような OS・ブラウザなどの修正が起こってしまっていたのでしたら,そのときの Windows Update の内容をご教示くださればと思います。

  • javascriptで要素の構造を生成

    昨日質問したプログラムの続きなんですが、 実はクリックした画像を大きくしたくてその方法を考えています function getElements ( obj ) { //イメージタグここから var src = obj.getAttribute('src'); var element = document.createElement('img'); element.src = src; //div生成 var box = document.createElement('div'); box.style.position = 'fixed'; box.class = 'photobig'; box.style.top = '50%'; box.style.left = '50%'; box.style.width = '900px'; box.style.height = '600px'; box.style.background = '#000000'; box.style.opacity = '0.7'; box.style.marginTop = '-300px'; box.style.marginLeft = '-450px'; box.innerHTML = element;//←ここが問題 var objBody = document.getElementsByTagName("body").item(0); objBody.appendChild(box); // body要素にdivエレメントを追加 // var objPhotobox = document.getElementsByClassName("photobig").item(0); // objPhotobox.appendChild(element); } javascriptでdivを生成し、その中にimgタグで画像を入れようとしています appendChildで生成した後で、innerHTMLにimgタグの情報を入れようとしています innerHTMLに変数をいれてもタグとして生成されないのが分かったところで、 divにクラス名を付けてそのクラスにappendChildしてみたんですが、これもダメでした どうすればよいのか見当つかず困っています 生成した後のものを扱うのが難しそうなので一度にすべて生成するようにするのかなと思いつつやり方がわかりません よろしくお願いします

  • java-prugin1.3、Netscape communicatorでアプレットが呼び出せない。

    私は現在JAVAアプレットを作成しそのクラスファイルをjarにして そのjarファイルの中からクラスファイルをロードするhtmlを書きたいので、 アプレットを貼り付ける個所に以下のようにタグを書いたのですがJAVAコンソール上でクラスが見つかりません。といわれて失敗してしまいます。 (netscapeのみ失敗します。IEは成功してアプレットを実行できます。) 何か他に必ず指定しなければいけない属性があるのでしょうか? javadocも見て確認したのですが。。。 どなたか教えていただけないでしょうか? ちなみにjarファイルもhtmlファイルも全て同階層のディレクトリにおいてあります。 ----------ソースここから-------------- <OBJECT classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93" width="200" height="200" codebase="http://java.sun.com/products/plugin/1.3/jinstall-13-win32.cab#Version=1,3,1,3"> <PARAM NAME="code" VALUE="ReportSample.class"> <PARAM NAME="archive" VALUE="Sample.jar"> <PARAM NAME="codebase" VALUE="."> <PARAM NAME="type" VALUE="application/x-java-applet;version=1.3"> <PARAM NAME="mylabel" VALUE="MyLabel"> <COMMENT> <EMBED type="application/x-java-applet;version=1.3" width="200" height="200" align="baseline" java_archive="Sample.jar" java_codeBase="./" java_code="ReportSample.class"  pluginspage="http://java.sun.com/products/plugin/1.3/plugin-install.html"> <NOEMBED> </COMMENT> Java Plug-inの実行に失敗しました </NOEMBED> </EMBED> </OBJECT> --------------------------------------

    • ベストアンサー
    • HTML
  • JavaScripsのDOMについてなんですが…

    閲覧ありがとうございます。 以前にSelectボックスで選んだ値の分だけテキストボックスの生成を行う方法を伺い、生成することが出来るようになりました。 (1)生成したテキストボックスを改行して表示がしたい。 (2)生成したテキストボックスの右隣にSelectボックスを生成し、Selectボックスで1~8の値を扱い、選んだ数値の分のテキストボックスをSelectボックスの右隣に生成するもの。 以下がSelectボックスで選んだ数値の分だけテキストボックスを生成するプログラムです。 <form name="form" action="index2.php"> <select id="factor" onchange="swicthForm(this)"> <option value="0">選んでください</option> <option value="1">1個</option> <option value="2">2個</option> <option value="3">3個</option> <option value="4">4個</option> <option value="5">5個</option> </select> </form> <br> <script type="text/javascript"> function swicthForm(obj){ var n=obj.nextSibling; while(n){ var m=n.nextSibling; if(n.nodeName=="INPUT" && n.type=="text") n.form.removeChild(n); n=m; } for(var i=0; i<parseInt(obj.value);i++){ var e=document.createElement("input"); e.setAttribute("type","text"); e.setAttribute("name","test"+(i+1).toString()); obj.form.appendChild(e); } } </script> よろしくお願いします。

  • [javascript][DOM]getElementByIdやremoveChildの戻り値と処理の結果

    以前から気になっていたけれど聞かなかったこと。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <title>QFUMEI テストケース1</title> <script type="application/ecmascript"> function init(){ var hoge = document.getElementById("hoge"); var fuga = document.getElementById("fuga"); hoge.removeChild(fuga); alert(fuga); // [object HTMLParagraphElement] ← nullではない fuga = document.getElementById("fuga"); alert(fuga); // null } </script> </head> <body onload="init();"> <div id="hoge"> <p id="fuga">ほげ</p> </div> </body> </html> 結局 fuga = getElementById("fuga")によって 何が代入されているのでしょう? document上のp#fugaへの参照であれば removeChildの直後 fuga = nullとなっていてもよさそうだなと思っているのですが・・・・。 hoge.firstChild.nodeValueをいじるとp要素内の文字列が変化するし・・・・

  • for in と 接続演算子について

    <!-- function check(){ var flag = 0; if(document.registform.user.value==""){ flag = 1; var error1 = document.getElementById("error1"); if(error1 == null){ var element1=document.createElement("div"); element1.innerHTML='<span class="error0" id="error1">ユーザー名を入力してください。</span>'; var ojbody1=document.getElementById("td_error1"); ojbody1.appendChild(element1); } } if(document.registform.pass.value==""){ flag = 1; var error2 = document.getElementById("error2"); if(error2 == null){ var element2=document.createElement("div"); element2.innerHTML='<span class="error0" id="error2">パスワードを入力してください。</span>'; var ojbody2=document.getElementById("td_error2"); ojbody2.appendChild(element2); } } if(document.registform.pass2.value==""){ flag = 1; var error3 = document.getElementById("error3"); if(error3 == null){ var element3=document.createElement("div"); element3.innerHTML='<span class="error0" id="error3">パスワード(確認)を入力してください。</span>'; var ojbody3=document.getElementById("td_error3"); ojbody3.appendChild(element3); } } if(flag == 0){ return true; }else{ return false; } } //--> javascript初心者です。 この処理をfor(key in array)を使って簡単にできるかも... と思ったんですが接続演算子の使い方がよくわかりません。 プログラム自体初心者独学で手探りでやっているため考え方が間違っている場合などありましたらアドバイス等もいただけたらうれしいです。 if(document.registform.user(☆).value==""){ flag = 1; var error1(☆) = document.getElementById("error1(☆)"); if(error1(☆) == null){ var element1(☆)=document.createElement("div"); element1(☆).innerHTML='<span class="error0" id="error1(☆)">ユーザー名(☆)を入力してください。</span>'; var ojbody1(☆)=document.getElementById("td_error1(☆)"); ojbody1.appendChild(element1(☆)); }} (☆)のところが接続演算子が使えればと思いました。 例えばvar element + key でelement1の変数というのは無理なのでしょうか? もし可能ならgetElementById("error + key ")はどういった書き方をすればよいでしょうか? よろしくお願いします。

  • Objectタグでgifを載せようとしたらテキストボックスになる。

    HTMLにObjectタグを使ってGif画像を載せようとしているのですが・・・ <object date="button/replay.gif" type="image/gif" classid="C3EAF164-E06A-11D2-B5C9-0050041B7FF6" id="Replay" name="replay" border="0" width="123" height="83"> <param・・・・(割愛) </object> このようなタグを書いたところ(改行はここに載せるために加えました。実際には改行はここまで入ってません)、画像が表示されず、何故か複数行テキストボックスが出てきてしまいました。 Gif画像を表示させるにはどうしたらよいでしょうか。 何故にテキストボックスがでてくるのでしょうか。。。 objectタグの奥深さに負けそうです。 どうぞご教授くださいますよう宜しくお願いいたします。

    • ベストアンサー
    • HTML
  • DOMで生成したタグにCSSが適用されない(IE)

    DOMでタグを生成した場合、IEではそのタグにCSSが適用されないのですが 何かいい解決法はないでしょうか。ちなみに試したHTMLは下記の通りです。 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title>test</title> </head> <body> <script type="text/javascript"><!-- A = document.createElement("div"); A.setAttribute("id", "A"); A.setAttribute("style", "color:red;"); document.body.appendChild(A); document.getElementById("A").appendChild(document.createTextNode("test")); --></script> </body> </html>

  • サーバ上でActiveXコントロールのオブジェクトを生成し、VBScr

    サーバ上でActiveXコントロールのオブジェクトを生成し、VBScriptからメソッド呼 び出しを行うため、下記のようなプログラムを作成しました。 [test.asp] <html xmlns="http://www.w3.org/1999/xhtml" > <head> <meta http-equiv="Content-Type" content="text/html; charset=x-sjis"/> <meta name="GENERATOR" content="Microsoft Visual Studio 6.0"/> </head> <body> <OBJECT id=Test1 style="LEFT: 0px; VISIBILITY: hidden; TOP: 0px" codeBase=Test.ocx#version=4,0,0,0 type=application/x-oleobject classid=clsid:XXXX runat="server"> </OBJECT> <script language=vbscript runat="server"> Response.Write(Request.Form(input1)) Test1.TestCall(Request.Form(input1)) </script> <script language=vbscript> Sub test1() Document.Testform.submit() End Sub </script> <form name="Testform" action="test.asp"method="POST"> <input style="width: 143px; height: 75px" type="button" name="button1" onclick="test1"/> <input type="hidden" name="input1" value=" "/> <!--ここにユーザ入力値を入れ る--> </form> </body> </html> Test.ocxは公開メソッドとして、ユーザ入力値を引数に持つ"TestCall"を持っていま す。 サーバ側でregsvr32 Test.ocxでレジストリ登録して、そのクラスIDを<OBJECT>タグ で指定しています。 これをクライアントから http://servername/test.asp で開くと、そのまま応答がなくなります。 VBScriptでTest.ocxのメソッドを使用している部分を削除すれば、普通にレスポンス が帰ってきます。 (Response.Write(Request.Form(input1))の結果が正しく表示されている) input1にはユーザ入力値を入れる処理をVBScriptで実装していますが、上記では省略 しています。 何か設定等足りないところがあるのでしょうか? Test.ocxのインスタンス生成に失敗しているような感じがします。 インスタンスはこのページがロードされたときにサーバ側で生成されるものと理解し ていますが、正しいでしょうか? なお、これと同じことをクライアントサイドで行った場合、正常にTest.ocxのメソッ ドをコールできています。 (<object>タグと<script>タグでrunat="server"を削除。) やりたいことは、ユーザーが入力したフォームデータをsubmit()して、サーバ上で ActiveXオブジェクトを生成して、VBScriptからActiveXの公開メソッドを呼び出し、 その中からさらにサーバ上の別プログラムを呼び出し、処理結果を受けてVBScriptへ 処理を戻し、結果をASPで処理してクライアントに返したいのです。 普通のWebアプリケーションとほぼ同じだと思いますが、ActiveXコントロールから別 のプログラム(レガシーアプリ)へはPostMessageで要求を投げているので、結果が 自身にPostされるまでSleepしてからVBScriptに処理を戻すという形にしようとして います。 サーバ環境はWindows Server 2003 + IIS6.0、クライアントはWindows XP Professional SP3 + IE6.0です。 リモートデバッグの仕方が分からず苦労しています。

  • javascriptのDOMについてなんですが・・・

    閲覧有難うございます。 JavaScriptのDOMを用いてテキストボックスを生成しようと考えているのですがうまくいきません。 <form name="form" action="index2.php"> <select id="factor" onchange="swicthForm()"> <option value="0">選んでください</option> <option value="1">1個</option> <option value="2">2個</option> <option value="3">3個</option> <option value="4">4個</option> <option value="5">5個</option> </select> </form> <br> <script type="text/javascript"> function swicthForm(){ var options = document.form.factor.value; alert(options); } } </script> を用いてSELECTでいくらを選んだかが表示することが出来ました。 alert(options)の値の分だけテキストボックスなり何なりを生成したいのですがうまくいきません。 どの様にしたらテキストボックスなどを表示できますか?

専門家に質問してみよう