• ベストアンサー

オブジェクトについて

http://homepage1.nifty.com/kodayan/javasc/syntax/this02.htm ここのHPにthisについての説明があるのですが いまいちわかりません。 <p id="p_id" class="p_class" style="cursor:hand" onclick="Test(this);">[ここをクリックすれば]</p> thisはタグ自身を参照すると書かれていますが この場合は<p>タグを参照しているのでしょうか? (それとも[ここをクリックすれば]という文字列オブジェクトを指しているのでしょうか?) また『thisはオブジェクトを指す』ととある本に書いてあったので もし<p>タグを指すとしたらタグもオブジェクトなのでしょうか? (タグがオブジェクトというのはピンときませんが) いろいろ質問してしまいましたが答えられる範囲 でけっこうですのでよろしくお願いいたします。

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

  • ベストアンサー
  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.5

#2><p></p>のように間に何もない場合もオブジェクトになるのでしょうか? なります。 何もなかったら、オブジェクトを作成しないというようなブラウザもありなのかもしれませんが、、(^^; 参考URL(質問者が参考としてあげられているURLのことです)でも <span></span> のようになっていて、その内容を後からスクリプトで入れていますよね。 中味のないタグがオブジェクトとして作成されないのであれば、こういうことはできませんね。

shoshosho
質問者

お礼

再度のご回答ありがとうございます。 なるほど中身がなくてもオブジェクトになるんですね。 これですっきりしました。 参考URLは私の勘違いだったようですいませんでした(^^;)

全文を見る
すると、全ての回答が全文表示されます。

その他の回答 (4)

noname#45950
noname#45950
回答No.4

タグの内容を、オブジェクト「として処理する」「として扱う」ということです。 どういうことかは、No.3さんのおっしゃる通り、DOMを勉強してみるといいと思います。

shoshosho
質問者

お礼

ご回答ありがとうございます。 DOMはまだ少しかじった程度ですので勉強してみようと思います。

全文を見る
すると、全ての回答が全文表示されます。
  • talepanda
  • ベストアンサー率58% (45/77)
回答No.3

興味があればDOM(Document Object Model)を勉強してみてください。

shoshosho
質問者

お礼

アドバイスありがとうございます。 DOMも並列して勉強しようと思います。

全文を見る
すると、全ての回答が全文表示されます。
  • BLUEPIXY
  • ベストアンサー率50% (3003/5914)
回答No.2

それぞれのタグは、ブラウザで読み込まれて解析されて 階層的な同等なオブジェクトで内部的に表現してそれを ブラウザ上で描画して表示しています。 この場合、<p>~</p> は、それに該当するp オブジェクトとして内部的に保持されているということです。 <p id="p_id" class="p_class" style="cursor:hand" onclick="Test(this);"> のような場合の this は、この(p)オブジェクト自身を表すことになり、呼び出される関数に自分自身(p)を渡すという指定になります。 [ここをクリックすれば] の部分は、この場合(参考URL)で言えば、 obj.innerText か obj.innerHTML で保持されています。(別の見方で言えば、pオブジェクトの子要素のテキストノード)

shoshosho
質問者

お礼

ご回答ありがとうございます。 詳しいご説明でだいぶ分かりました。 (pオブジェクトの子要素のテキストノード)この言葉が非常に分かりやすかったです。 ここでふと思ったのですが<p></p>のように間に何もない場合も オブジェクトになるのでしょうか? 最後に間違っていたらすいませんが参考URLとは私が提示しているURL のことでしょうか? 回答欄の参考URLは空白のようなので

全文を見る
すると、全ての回答が全文表示されます。
noname#35109
noname#35109
回答No.1

HTML における JavaScript に関しては,ほとんど素人ですが, 答えられる範囲で…・・・ タグも1つのオブジェクトでしょう。 「HTML タグオブジェクトのプロパティとメソッド」 (Dreamweaver の ヘルプ) http://livedocs.macromedia.com/dreamweaver/8_jp/extending/06_dw_d6.htm  ---引用--- > HTML タグオブジェクトのプロパティとメソッド > HTML タグはすべて JavaScript オブジェクトによって表されます。 > タグはツリー階層で編成されます。 > y が x の開始タグと終了タグに完全に囲まれている場合 > (<x>x の内容 <y>y の内容 </y>x の内容の続き </x>)、 > x タグは y タグの親となります。 > したがって、コードを適切に構成する必要があります。 上の URL が全てを言っていると思いますが, ためしに実験したみました。 まず, ご質問で書かれている URL の Pタグを次のように書き換えてみました。 <p id="p_id" class="p_class" style="cursor:hand" onclick="alert(this);">[ここをクリックすれば]</p>  ↓表示結果↓ [object] 次のように書き換えると, <p onclick="alert(this.tagName);">[ここをクリックすれば]</p> ↓表示結果↓ P Pタグだけでは何なので, そのPタグの下あたりに次の行を書き加えました。 <A HREF="javascript:alert(this)">[ここもクリックすれば]</A>  ↓表示結果↓ [object] 次のようにすると, <A onclick="javascript:alert(this.tagName);">[ここもクリックすれば]</A>  ↓表示結果↓ A やはり < > 内も1つのオブジェクトです。

shoshosho
質問者

お礼

ご回答ありがとうございます いろいろ実験もしていただいてありがとうございました。 タグもオブジェクトだということですね。

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • IE限定可 <tr>~</tr>タグの上げ下げ方法は?

    <FORM id=formid name=frm action=#> <table> <tr onclick=chCell(this) onFocus=chCell(this)> <td style=CURSOR:hand>cell 1</td> <td style=CURSOR:hand>hoge</td> </tr> <tr onclick=chCell(this) onFocus=chCell(this)> <td style=CURSOR:hand>cell 2</td> <td style=CURSOR:hand>hoge</td> </tr> <tr onclick=chCell(this) onFocus=chCell(this)> <td style=CURSOR:hand>cell 3</td> <td style=CURSOR:hand>hoge</td> </tr> <table> <input type="button" value="項目を上げる"> <input type="button" value="項目を下げる"> </form> 上記のようなフォームで以下の事が実装したいのですがどなたかご教授頂けませんでしょうか。 ・ 項目(行)をクリックすると色が変わる ← (実装済み) ・ 行を指定して「項目を上げる」をクリックすると上へ上がる ・ 行を指定して「項目を下げる」をクリックすると下へ上がる ・ 矢印キーでフォーカスの上下移動 何卒お願い申し上げます。

  • リンクメニュー収納を2つ以上つくりたいのですが

    こんにちは。今、ホームページを作っています。javascriptで上手くいかない点があるので、質問させていただきます。回答よろしくお願い致します。 文字をクリックしたら下にメニューが表示されるようにしたく、<head>タグ内に <script type="text/javascript"> <!-- function expand(id) { if (id.style.display == "none") { id.style.display = "";} else {id.style.display = "none";} window.event.cancelBubble = true;} // --> </script> <body>タグ内に <span class="list" onclick="expand(a);" style="cursor:hand;">【項目1】</span><div id="a" style="display:none"> <a href="リンクしたいURL">内容1</a><br> <a href="リンクしたいURL">内容2</a><br> <a href="リンクしたいURL">内容3</a> </div> としています。これが1つだと問題なく表示されるのですが、この下に<span class="list" onclick="expand(a);" style="cursor:hand;">【項目2】</span><div id="a" style="display:none">…など2つ以上続けるとエラーが出てしまい上手く表示されません。 出来れば、 【項目1】   内容1    ←【項目1】をクリックすると表示   内容2    ←   内容3…   ← 【項目2】   内容4…   ←【項目2】をクリックすると表示 【項目3】   内容5…   ←【項目3】をクリックすると表示 ・・・となるようにしたいのですが…。このような場合にはどうしたら良いのでしょうか。どなたかご回答よろしくお願いいたします。

    • ベストアンサー
    • Java
  • テーブルリンクに付いて

    下記のテーブルリンクを作成しましたがクリックしても説明文が表示されません どなたか教えて下さい <p align="center"> <TABLE HEIGHT=30 BORDER=1 BGCOLOR="#FFFFFF" CELLSPACING=0> <TR> <TD WIDTH=150 ALIGN="center" onClick="window.location.href='http://uye43ys.dousetsu.com/simpleVC_20110728074105.html'" onmouseover="this.style.backgroundColor='#80FFFF';" onmouseout="this.style.backgroundColor=''" STYLE="cursor:hand;">特典サービス</TD> <TD WIDTH=150 ALIGN="center" onClick="window.location.href='http://uye43ys.dousetsu.com/simpleVC_20110728075504.html'" onmouseover="this.style.backgroundColor='#80FFFF';" onmouseout="this.style.backgroundColor=''" STYLE="cursor:hand;">車検費用</TD>

  • <td>の中のonClick="location" で

    教えて下さい。 <td class="text-small" style="cursor:hand" onClick="location.href=''">XXXXXX</td> 上記のような記述に「target="_blank"」の機能をもたせるにはどうしたらいいのでしょうか? (セル内のどこでもクリックできるようにしたく、かつその時別ウィンドウが開くようにしたいのですが・・・) 宜しくお願いします。

  • どこをどうすれば…

    <span style='cursor:hand' onclick=d()>gobbledygook</span> というのはどういう意味ですか? <span style='cursor:hand'はわかるのですが…

  • 横に並べて表示したい。

    <span onclick="expand(chip1);" style="cursor:hand;">ここは文字 </span> 上記のタグを、横にふたつ並べて表示したいのですが可能でしょうか。 これは下に(オンクリックで表示される)文字が続くため、<br>タグを入れなければいいというものでもないですし・・・。

  • 関数を呼び出したエレメントのオブジェクトを取得する方法

    お世話になります。 function ChngLang(ThisElm,ChngElm){ ・・・・・・・・・・・ } と関数を定義し、 <input type=button value="続き" onClick="ChngLang(this,'CmntCrab2')"> <div id="CmntCrab2"> </div> とすれば、この呼び出したタグ<input >のvalueを変えたりと<input>タグを操作できます。 ここで、 function ChngLang(ThisElm,ChngElm){ を、 function ChngLang(ChngElm){ と、いうようにしても、呼び出した側のエレメントのオブジェクト つまり、<input>タグのオブジェクトthisを関数ChngLang()の中で取得することはできないものでしょうか。 呼び出し側では引数thisを省略して <input type=button value="続き" onClick="ChngLang('CmntCrab2')"> というようにしたいのですが。 よろしくお願いいたします。

  • テーブルリンクで別ウインドウで開くようにするには?

    <table> <tr> <td onClick="window.location.href='a.html'" onmouseover="this.style.backgroundColor='#80FFFF';" onmouseout="this.style.backgroundColor=''" STYLE="cursor:hand;">a</td> </table> このようにしてオンマウスでTD内の色を変え、TD全体でリンクさせる時、別ウインドウで開くにはどうしたらよいですか? それとも、テーブルリンクで別ウインドウで開く指定は出来ないんでしょうか? <table> <tr> <td onClick="window.location.href='a.html' XXXXX" onmouseover="this.style.backgroundColor='#80FFFF';" onmouseout="this.style.backgroundColor=''" STYLE="cursor:hand;">a</td> </table> XXXXXの部分にtarget='_blank'と入れてみたんですが、今度はリンクのアクションすらしなくなってしまいました。 よろしくお願いします。

  • VBAでonclickイベントをクリックしたい

    お世話になります。 XP/エクセル2003/IE8使用です。 テーブルタグ内で、onclickイベントでクリックすれば画面遷移するタグを VBAでクリックしたいのですが、記述方法がわかりません。 (IE起動などは大丈夫です。また、aタグやinputタグのクリックは処理できます) 具体的には、画像の「重要情報」(タブ風テーブル)から「出品情報」(タブ風テーブル)に移動し、再度、「重要情報」に戻ってきたいです。 HTMLソースは下記の通りです。 '---「重要情報」 <td id="basics" class="titletab-active" nowrap="nowrap" onclick="productTableController.switchTab('basics');return false;"> <span class="requiredAsterisk bold" id="tabAsterisk_basics"> <img src="https://images*略*.gif"></span> <span class="sprites" id="validation_error" title="" onclick="" style="display: none;"></span> <span class="sprites" id="ldr_warning" title="" onclick="" style="display: none;"></span> <span class="sprites" id="quarantine_warning" title="" onclick="" style="display: none;"></span> 重要情報</td> '---???(何の記述なのか私には不明) <td id="variation" class=" titletab-inactive hide" nowrap="nowrap" onclick="productTableController.switchTab('variation');return false;" style="display: none;"> <span class="sprites" id="validation_error" title="" onclick="" style="display: none"></span> <span class="sprites" id="ldr_warning" title="" onclick="" style="display: none"></span> <span class="sprites" id="quarantine_warning" title="" onclick="" style="display: none"></span> バリエーション</td> '---「出品情報」 <td id="offer" class="titletab-inactive" nowrap="nowrap" onclick="productTableController.switchTab('offer');return false;"> <span class="requiredAsterisk bold" id="tabAsterisk_offer"> <img src="https://images*略*.gif"></span> <span class="sprites" id="validation_error" title="" onclick="" style="display: none;"></span> <span class="sprites" id="ldr_warning" title="" onclick="" style="display: none;"></span> <span class="sprites" id="quarantine_warning" title="" onclick="" style="display: none;"></span> 出品情報</td> よろしくお願いします。

  • ツリーメニュータグに関して

    ツリーメニューに関して質問です。 最初の表示は ・メニュー ・メニュー(2) で、それぞれをクリックすると、 ・メニュー  ├1-1  ├1-2  └1-3 ・メニュー(2)  ├2-1  ├2-2  └2-3 と表示させたくて、タグ配布サイト様からツリーメニュータグをお借りし作成しました。 するとツリーの表示は問題ないんですが、ツリーメニュー配置場所以下にページがスクロールしなくなってしまいました。 上から50行目くらいに設置したツリーメニューより下にあと10行ほど文章があるのに、ツリーメニューが画面最下部に表示される位置までスクロールしたら、その下にはスクロールできない状態です。 説明下手ですみません。 配布サイト様に直接質問させていただこうと思ったのですが、そのサイト様は個人からの質問メールには答えないとあったので、こちらで質問させていただきます。 以下使用タグです。 <script type="text/javascript"> <!-- function expand(id) { if (id.style.display == "none") { id.style.display = ""; } else { id.style.display = "none"; window.event.cancelBubble = true; } // --> </script> <span onclick="expand(sample);" style="cursor:hand;">・メニュー</span> <div id="sample" style="display:none"> ├1-1<br> ├1-2<br> └1-3</div> <span onclick="expand(sample2);" style="cursor:hand;">・メニュー(2)</span> <div id="sample2" style="display:none"> ├2-1<br> ├2-2<br> └2-3</div> 他にツリーメニューを表示させることのできるタグがあることは知っていますが、調べたサイトの中で上記がいちばん短いタグだったので、使用したいなと思いました。 もしどこかを直せば正常に表示されるのであれば、お教えいただければ幸いです。

このQ&Aのポイント
  • 問題が発生し、暗証番号(PIN)を使用できません。再度設定する方法を教えてください。
  • クリックしても無反応で、暗証番号(PIN)のセットアップができません。対処方法を教えてください。
  • Shift+再起動やスタートアップ修復を試みましたが、パスワードが受け付けられず先に進めません。正しいパスワードを入力しています。困っています。
回答を見る