- ベストアンサー
javascriptでクラスを使った要素の移動方法
- javascript初心者ですが、クラスを使って要素の移動を試みました。
- しかし、うまく動作せず困っています。
- どのようにすれば要素とクラスを紐づけることができるのでしょうか？
- dkong
- お礼率86% (170/197)
- JavaScript
- 回答数4
- ありがとう数4
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
<div id="a"></div> よりも上にスクリプトを書いたりしていない？
その他の回答 (3)
- itu1989
- ベストアンサー率44% (37/83)
「this.ele = document.getElementById("a");」がhtmlの「<div id="a"></div>」より後で実行される必要があります。 なので、初期化を行う用のメソッドを用意してbodyのonloadイベント時に呼び出せばhtml構成後に呼び出されます。 後、他の人が言って下さってるスタイルのpositionが設定できていれば動くはずです var cha; function init(){ cha = new Character(10,10); } function Character(x,y){ ...省略 } <body onload="init(); cha.move();"> <div id="a"></div> (1)座標を指定する時はpositionを指定しよう (2)getElementByIdする場合はhtml構成後に取得しよう
お礼
ありがとうございます。（１）（２）きちんんとすれば、うまくいきました。
- gorusura
- ベストアンサー率59% (25/42)
実は、座標は、数値ではないんです。 width:100px; height:100px; のように。 つまり、'100px' のように指定すれば、動きますよ。 ところで、this.move = .... という風に毎回メソッドを作成されていますが、その様なことは通常せず、 function Character(x,y){ this.ele = document.getElementById("a"); this.x = x; this.y = y; } Character.prototype.move = function () {......} ってやると、より クラス っぽくなりますよ！
お礼
ありがとうございます。pxをつけるのを忘れていました。
- askaaska
- ベストアンサー率35% (1455/4149)
惜しいわ すごく惜しい スタイルシートの topとleftが有効になる条件を満たしていないのよ positionを指定してあげないといけないわ
お礼
早速ありがとうございます。
補足
bodyにposition:relative div #aにposition:absoluteを設定したのですが、うまくいきません。設定しかた間違っていますか？
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/images/related_qa/c205_1_thumbnail_img_sm.png)
お礼
<div id="a"></div>よりも上にスクリプトを書いてました。初歩的なミスをしていました。