すでにクラスを持っている要素があります。
``html 因みに、以下のようになります。 因みにimg ... id="image1" name="image1" />
ここで、div
にクラスを追加する(置き換えるのではなく、追加する)JavaScriptの関数を作りたいと思います。
どのようにすればよいでしょうか?
要素の className
プロパティに、スペースと新しいクラスの名前を追加します。まず、簡単に参照ができるように、要素に id
を付けます。
<div id="div1" class="someclass">
<img ... id="image1" name="image1" />
</div>
次に
var d = document.getElementById("div1");
d.className += " otherclass";
otherclass`の前のスペースに注意してください。スペースを入れておかないと、クラスリストで前に来る既存のクラスが損なわれてしまうからです。
element.className on MDN](https://developer.mozilla.org/en-US/docs/Web/API/Element/className)も参照してください。
このクラスを追加するだけではなく(例えば、非同期のリクエストなど)、PrototypeやjQueryのようなライブラリをお勧めします。
これを使えば、あなたがやるべきこと(これも含めて)がほぼすべてシンプルになります。
例えば、ページにjQueryを導入したとすると、次のようなコードを使って、要素(この場合はロード時)にクラス名を追加することができます。
$(document).ready( function() {
$('#div1').addClass( 'some_other_class' );
} );
その他の機能については、jQuery API browserをご覧ください。