私的良スレ書庫
不明な単語は2ch用語を / 要望・削除依頼は掲示板へ。不適切な画像報告もこちらへどうぞ。 / 管理情報はtwitterでログインするとレス評価できます。 登録ユーザには一部の画像が表示されますので、問題のある画像や記述を含むレスに「禁」ボタンを押してください。
元スレ+ JavaScript の質問用スレッド vol.85 +
JavaScript スレッド一覧へ / JavaScript とは? / 携帯版 / dat(gz)で取得 / トップメニューみんなの評価 :
レスフィルター : (試験中)
質問です。
sample1 は、想定通りに画像が表示されるのですが、
sample2 は、[object HTMLImageElement]と表示されます。
sample2 で、画像を表示するにはどうすればいいのでしょうか？
オブジェクトとかそのあたりの挙動がよくわかっていないのですが、
この問題について自力で解決した場合に参考になるページなどあれば教えて欲しいです。
ちなみにプログラミング歴1年未満の素人です。
// sample1
$('#view').append(getImg());
// sample2
$('#view').append('<p>' + getImg() + '</p>');
function getImg() {
var img = document.createElement('img');
img.src = '
';
img.className = 'test';
return img;
}
sample1 は、想定通りに画像が表示されるのですが、
sample2 は、[object HTMLImageElement]と表示されます。
sample2 で、画像を表示するにはどうすればいいのでしょうか？
オブジェクトとかそのあたりの挙動がよくわかっていないのですが、
この問題について自力で解決した場合に参考になるページなどあれば教えて欲しいです。
ちなみにプログラミング歴1年未満の素人です。
// sample1
$('#view').append(getImg());
// sample2
$('#view').append('<p>' + getImg() + '</p>');
function getImg() {
var img = document.createElement('img');
img.src = '
'; img.className = 'test';
return img;
}
>>58
コードを実際に動かしていないけど。
まず、どこがいけないか。
getImg()の返り値はDOMオブジェクト。 document.createElementで作っているから。
そのDOMオブジェクトを+演算子で文字列と結合しようとしているから、DOMオブジェクトが文字列に変換されてから結合されている。
つまり、sample2の式
'<p>' + getImg() + '</p>'
の時点で、この式の値が
'<p>[object HTMLImageElement]</p>'
という文字列に評価されている。
問題の解決方法はいろいろあるし、それぞれにメリット・デメリットがあるが、jQueryを使うのなら素直に
$('#view').append('<p><img class="test"src="" /></p>');
とでもやるのが最も簡単だろうな。
コードを実際に動かしていないけど。
まず、どこがいけないか。
getImg()の返り値はDOMオブジェクト。 document.createElementで作っているから。
そのDOMオブジェクトを+演算子で文字列と結合しようとしているから、DOMオブジェクトが文字列に変換されてから結合されている。
つまり、sample2の式
'<p>' + getImg() + '</p>'
の時点で、この式の値が
'<p>[object HTMLImageElement]</p>'
という文字列に評価されている。
問題の解決方法はいろいろあるし、それぞれにメリット・デメリットがあるが、jQueryを使うのなら素直に
$('#view').append('<p><img class="test"src="
" /></p>'); とでもやるのが最も簡単だろうな。
>>62
javascriptはプロトタイプベースのオブジェクト指向言語だから、クラスというものはない。
http://ja.wikipedia.org/wiki/%E3%83%97%E3%83%AD%E3%83%88%E3%82%BF%E3%82%A4%E3%83%97%E3%83%99%E3%83%BC%E3%82%B9
http://www.atmarkit.co.jp/fdotnet/ajaxjs/ajaxjs04/ajaxjs04_01.html
javascriptはプロトタイプベースのオブジェクト指向言語だから、クラスというものはない。
http://ja.wikipedia.org/wiki/%E3%83%97%E3%83%AD%E3%83%88%E3%82%BF%E3%82%A4%E3%83%97%E3%83%99%E3%83%BC%E3%82%B9
http://www.atmarkit.co.jp/fdotnet/ajaxjs/ajaxjs04/ajaxjs04_01.html
>>55
興味があるんだけど、コード片を示せる？
興味があるんだけど、コード片を示せる？
>>67
var Test = function(){};
(function() {
function c() {
return "c";
};
Test.prototype.a = function() {
return "a";
};
Test.prototype.b = function() {
return c();
};
})();
// debug
var test = new Test();
print(test.a()); // a
print(test.b()); // c
//print(test.c()); // error
var Test = function(){};
(function() {
function c() {
return "c";
};
Test.prototype.a = function() {
return "a";
};
Test.prototype.b = function() {
return c();
};
})();
// debug
var test = new Test();
print(test.a()); // a
print(test.b()); // c
//print(test.c()); // error
>>72みたいなコード書くぐらいならJavaScriptでは不可能と諦めたほうがいいと思う
とっても気持ち悪いコードだ・・・
とっても気持ち悪いコードだ・・・
全然普通じゃんか。
関数を入れ子にする場合は、リテラルにする方が好みだけど。
関数を入れ子にする場合は、リテラルにする方が好みだけど。
フレームワークの裏で動いていたり趣味でやってる分にはいいけど
実装でこんなコードはちょっとやだなぁ
実装でこんなコードはちょっとやだなぁ
そこは初心者関係無いような気がするが・・
個人の指向性の問題だろ。
要するに、JavaScript向いてないってことだな。
個人の指向性の問題だろ。
要するに、JavaScript向いてないってことだな。
bshのソースが、CなのにALGOL風マクロで書かれているみたいな話だよね。
それを学習して身に付けちゃっていいかというと、ちと疑問。
それを学習して身に付けちゃっていいかというと、ちと疑問。
前スレの832で見かけたけど、
文字列を\で連結することで何行マークアップがあろうが、
document.writeを1回呼ぶだけで書き込めちゃうんだな。
知らなかったわ。
>document.open();
>document.write('<table border="0" width="100%">\
><tr>\
><td width="95"><a href="" target="hoge"><img src="" alt="" height="115" width="90"></a>\
></td>\
></tr>\
>');
>document.close();
行毎にdocument.write書くよりよっぽどスマートだし、パフォーマンスもいいはず。
tableタグ閉じ忘れてるけどね。
これJavaScripterには常識だったりするん？
文字列を\で連結することで何行マークアップがあろうが、
document.writeを1回呼ぶだけで書き込めちゃうんだな。
知らなかったわ。
>document.open();
>document.write('<table border="0" width="100%">\
><tr>\
><td width="95"><a href="" target="hoge"><img src="" alt="" height="115" width="90"></a>\
></td>\
></tr>\
>');
>document.close();
行毎にdocument.write書くよりよっぽどスマートだし、パフォーマンスもいいはず。
tableタグ閉じ忘れてるけどね。
これJavaScripterには常識だったりするん？
>>85
悪しき慣習だと思うな。普通は使わない。
悪しき慣習だと思うな。普通は使わない。
>>85
サンクス
↓おそらくこれのことだよな
http://es5.github.com/#x7.8.4
>>87
その変数に入れるってやつはどう書くの？
行毎にクォーテーションで囲むのは結構手間だから、
連結する方が生産性高いと俺は思うんだがな。
サンクス
↓おそらくこれのことだよな
http://es5.github.com/#x7.8.4
>>87
その変数に入れるってやつはどう書くの？
行毎にクォーテーションで囲むのは結構手間だから、
連結する方が生産性高いと俺は思うんだがな。
\は事故の元じゃね。知らない人もいるだろうし。
>手間
置換で追加すればいい。\入れるのとほとんど変わらないよ。
俺も+で繋げるなら前もって変数に+=で繋げるかな。
>手間
置換で追加すればいい。\入れるのとほとんど変わらないよ。
俺も+で繋げるなら前もって変数に+=で繋げるかな。
改行を任意の文字列に一括置換すればいい。
+ の連結が気持ち悪いならjoinするとか。
(パフォーマンス気にする人はdocument.writeを使わないと思うけど)
+ の連結が気持ち悪いならjoinするとか。
(パフォーマンス気にする人はdocument.writeを使わないと思うけど)
obj.hoge = "なにか";
でhogeに値がセットされる瞬間にフックしたいんだけど。
unsafeWindow.__defineSetter__("hoge",function(x){
//なんか処理
this.hoge = x; //ここまずい
});
ってやると無限再起でスタックオーバーフローになるます
どうやれば回避できますか？
でhogeに値がセットされる瞬間にフックしたいんだけど。
unsafeWindow.__defineSetter__("hoge",function(x){
//なんか処理
this.hoge = x; //ここまずい
});
ってやると無限再起でスタックオーバーフローになるます
どうやれば回避できますか？
結構不評なんだなー
使ってみようかと思ってたが、これが世間の声だと思ってやめとくわ。
>>92
document.writeは、オンロード後のDOM処理とはタイミングが違うから
document.writeならではの使いどころがあると思う。
一概に言えないと思うよ。
使ってみようかと思ってたが、これが世間の声だと思ってやめとくわ。
>>92
document.writeは、オンロード後のDOM処理とはタイミングが違うから
document.writeならではの使いどころがあると思う。
一概に言えないと思うよ。
前へ 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 次へ
/ 要望・削除依頼は掲示板へ / 管理情報はtwitterで / 
JavaScript スレッド一覧へ類似してるかもしれないスレッド
- + JavaScript の質問用スレッド vol.95 + (1001) - [97%] - 2012/1/17 4:16
- + JavaScript の質問用スレッド vol.81 + (1001) - [97%] - 2010/12/10 20:01
- + JavaScript の質問用スレッド vol.89 + (1001) - [97%] - 2011/9/4 4:17
- + JavaScript の質問用スレッド vol.88 + (1001) - [97%] - 2011/7/20 7:03
- + JavaScript の質問用スレッド vol.87 + (1001) - [97%] - 2011/6/21 6:33
- + JavaScript の質問用スレッド vol.86 + (1001) - [97%] - 2011/5/27 21:50
- + JavaScript の質問用スレッド vol.84 + (1001) - [97%] - 2011/3/30 7:32
- + JavaScript の質問用スレッド vol.83 + (1001) - [97%] - 2011/2/24 8:02
- + JavaScript の質問用スレッド vol.82 + (1001) - [97%] - 2011/1/19 7:54
- + JavaScript の質問用スレッド vol.80 + (1001) - [97%] - 2010/11/9 2:17
- + JavaScript の質問用スレッド vol.75 + (1001) - [97%] - 2010/1/23 1:07 ○
- + JavaScript の質問用スレッド vol.135 + (1002) - [95%] - 2018/11/23 10:30
- + JavaScript の質問用スレッド vol.115 + (1001) - [95%] - 2014/5/29 16:16
- + JavaScript の質問用スレッド vol.105 + (1001) - [95%] - 2013/5/20 4:45
- + JavaScript の質問用スレッド vol.125 + (1001) - [95%] - 2015/10/7 17:45
- + JavaScript の質問用スレッド vol.94 + (1001) - [95%] - 2012/1/8 15:46
- + JavaScript の質問用スレッド vol.97 + (1001) - [95%] - 2012/3/1 3:31
トップメニューへ / →のくす牧場書庫について