JavascriptでのDOM操作をおしえてください。

Question

<input placeholder="" id="passwd"> に対して後からJSでplaceholderに値を入れたいです。

Answer 1

placeholderに対応している場合、placeholderプロパティを利用できます。

document.getElementById('passwd').placeholder = 'example';

Comments

[enokiyo]

追加情報、ありがとうございます。

Answer 2

<input placeholder="" id="passwd">

<script>
(function(window,document){
	document.getElementById('passwd').setAttribute('placeholder','任意の文字列');
})(window,document);
</script>

これでいかがでしょうか？

Comments

[enokiyo]

ありがとうございます。

ところで
(function(window,document){
スクリプト
})(window,document);
と
window.onload = function() {
スクリプト
}
は相当違いますか？

[rik]

windowは使用していないので

(function(document){
document.getElementById('passwd').setAttribute('placeholder','任意の文字列');
})(document);

でもいいです。

onloadにしたいならば、

(function(window,document){
window.addEventListener('load',function(){onLoadFunc();},false);
function onLoadFunc() {
document.getElementById('passwd').setAttribute('placeholder','任意の文字列');
}
})(window,document);

です。

(function(){
...
})();
とすることで、カプセル化になります。
今回は変数を使用していませんのでカプセル化する意味は特にありませんが、
コード量が多くなるとカプセル化の重要性が分かってくると思います。

window.onload よりも、
window.addEventListener('load',...,...)の方が比較的新しい書き方で、
後者の方が今後も推薦される書き方です。
ただし、古いブラウザはaddEventListenerに対応していませんので注意が必要です。

[enokiyo]

ありがとうございます。
新しい書き方なのですね。
大変参考になりました。