JavaScriptの論理演算子について
- JavaScriptの論理演算子について質問です。
- 「alert(e.target||e.srcElement);」の結果がtrue かfalseではなくて「object HTMLHtmlElement」となるのは何故なのでしょうか？
- JavaScriptでは"||"は論理演算子ではないのでしょうか？
- ベストアンサー
JavaScriptの論理演算子について
JavaScriptの論理演算子について質問です。 「alert(e.target||e.srcElement);」の結果がtrue かfalseではなくて「object HTMLHtmlElement」となるのは何故なのでしょうか？ JavaScriptでは"||"は論理演算子ではないのでしょうか？ ----------------------------------------------------------------------- <body> <a id="id1">Textarea</a> <script> (function () { var i = document.getElementById ("id1"); document.addEventListener("dblclick", addEL, false); function addEL (e) { alert(e.target||e.srcElement); } }) (); </script> </body>
- hwbigin
- お礼率28% (41/143)
- JavaScript
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
|| は「バイナリ論理演算子」で論理演算子の一種です。 http://www2u.biglobe.ne.jp/~oz-07ams/prog/ecma262r3/11_Expressions.html#section-11.11 https://developer.mozilla.org/ja/JavaScript/Reference/Operators/Logical_Operators --- // 1-1. A をBoolean型に型変換し、true を返すなら A を返します。 // 1-2. A をBoolean型に型変換し、false を返すなら B を返します。 var x = A || B; // 1-1. A をBoolean型に型変換し、false を返すなら B を返します。 // 2-1. B をBoolean型に型変換し、false を返すなら C を返します。 var y = A || B || C; --- 疑問を持つのは大切なことですが、もう少し自分で調べてから質問するとより理解が深まるのではないかと思います。 # リファレンスを読めばもう一歩進んだ質問ができるのではないでしょうか。
その他の回答 (1)
- Werner
- ベストアンサー率53% (395/735)
論理演算子||は、 A || B とした場合、Aが真のときにはAが、Aが偽の時にはBが返却されます。 なお、Aが真の時にはBは評価されません。これをショートサーキットといいます。 JavaScriptに限らず||演算子はたいていの言語でこんな挙動します。 上記の挙動を利用して、 if(A){x=A;}else{x=0;} を x = A || 0; と書いたりできます。
補足
有難うございます。 何分未熟なもので、自分なりに解釈した結果を確認させて頂きたいと思います。 >>if(A){x=A;}else{x=0;} >>を >>x = A || 0; >>と書いたりできます。 if(A){}のAはbool型であるかどうかに関係なく、0以外だった場合はx=Aになり、 それ以外の場合x=0となるということで良いでしょうか？ つまり、「e.target||e.srcElement」についてもe.targetが存在すればe.targetのプロパティを返し、 そうでなければe.srcElementのプロパティを返すということでしょうか？ 解釈間違えていたら教えて頂きたいです。 宜しくお願いいたします。
関連するQ&A
- JavaScriptのイベントについて
JavaScriptを使ってページのウィンドウ上でダブルクリックをした時 テキスト1の文字列を変更するようにしたいのですが、 下記のページを読み込むとページがロードすると同時に テキスト部分が変更されてしまいます。 addEventListenerの使い方が間違えているのでしょうか。 よろしくお願いいたします。 ---------------------------------------------------------------------- <body> <a id=id1>テキスト1</a> <script> i = document.getElementById("id1"); document.addEventListener("dblclick", addEL(), !1); function addEL(){ i.innerHTML="addEventListener!"; } </script> </body>
- ベストアンサー
- JavaScript
- JavaScript IDの複数読み込みについて
JavaScript（プログラミング）はほとんど知識のないもので、 自分なりに調べたのですが、分からないので質問させていただきます。 下記のようなJavaScriptがあります。 window.onload = function() { var target = document.getElementById("●●"); target.addEventListener("touchstart", function(){this.className="touchstyle";}, false); target.addEventListener("touchend", function(){this.className="notouchstyle";}, false); } "●●"のほかに"▲▲" "■■"というIDを読み込ませたいのですが、 それは可能でしょうか。 （"xxx"はclass指定に変更でも構いません） 色々と試してみたのですが、うまくいかず困っております。 何卒ご教授のほど宜しくお願い致します。
- ベストアンサー
- JavaScript
- javascriptで困っています
スマホでタッチした場所の座標を取得しようとしているのですが、いろいろ調べて以下のように作ってみましたが、座標が取得できません。どこを直せばいいのか、教えていただきたく投稿させていただきました。よろしくお願いします。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"/> <meta name="viewport" content="width=320, user-scalable=no" /> <script type="text/javascript" charset="utf-8"> var touch_box = document.getElementById("box"); touch_box.addEventListener("touchstart", function(e){ document.getElementById("txt0").innerHTML = "スタート"; document.getElementById("txt1").innerHTML = e.pageX; document.getElementById("txt2").innerHTML = e.pageY; }, false); touch_box.addEventListener("touchmove", function(e){ document.getElementById("txt0").innerHTML = "ムーブ"; document.getElementById("txt1").innerHTML = e.pageX; document.getElementById("txt2").innerHTML = e.pageY; }, false); touch_box.addEventListener("touchend", function(e){ document.getElementById("txt0").innerHTML = "エンド"; document.getElementById("txt1").innerHTML = e.pageX; document.getElementById("txt2").innerHTML = e.pageY; }, false); </script> </head> <body> <div id="box"> <span id="txt0"></span><br /> X:<span id="txt1"></span>, Y:<span id="txt2"></span><br /> </div> </body> </html>
- ベストアンサー
- JavaScript
- formのsubmitイベントの発生についての質問です。
formのsubmitイベントの発生についての質問です。 あるところで、「form.submit() は submit イベントを発火しない」 とあったので、 ↓のscriptで、formのsubmitイベントを調べていました。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>SessionTestNext</title> <style type="text/css"></style> <script type="text/javascript"> function send1(elm){ elm.form.submit(); } function send2(){ document.getElementById("form1").submit(); } if('undefined' !== typeof document.addEventListener){ document.addEventListener('submit', function(event){ var target = event.target; alert(target.id); }, false); } else if ('undefined' !== typeof document.attachEvent){ document.attachEvent('onSubmit', function(event){ var target = event.srcElement; alert(target.id); }); } </script> </head> <body> <p>SessionTestNext 1 </p> <form id="form1" action="/php/session2.php" method="post" onsubmit="alert('Submited!');return false;"> <input type="text" name="parm2" value="fugafuga"> <input type="submit" value="サブミット"> <button onclick="send1(this)">Javascriptサブミット(1)</button> </form> <button onclick="send2()">Javascriptサブミット(2)</button> </body> </html> だのに、 send1()を実行した時は、イベントが検知され'Submited!'がアラートします。 ただし、onsubmitのハンドラーでfalseを返してるので、サブミットしません。 send2()を実行した時は確かに、submitイベントは発生せず、'Submited!'の アラート無しで、実際サブミットされます。 documentにaddEventListenerで追加したハンドラーの方でも、send1()の 時だけ検知され'form1'がアラートします。 send1()で検知されるのは何故でしょう？ また、IEでも同様の動作なんですが、何故か document.attachEvent('onsubmit', の方が、まったく動きません。（タイポかも）
- ベストアンサー
- JavaScript
- 【javascript 文法】値渡し？参照渡し？
以下実行すると、AAAをクリックしてもBBBをクリックしても「BBB」とアラートされます。 <html> <head> <script type="text/javascript" src="prototype.js"></script> </head> <body> <script type="text/javascript"><!-- var gDown= false; var div = document.createElement('div'); div.id = 'AAA'; div.innerHTML = 'AAA'; document.body.appendChild(div); Event.observe(div, 'mousedown',function(){ gDown = div; }); var div = document.createElement('div'); div.id = 'BBB'; div.innerHTML = 'BBB'; document.body.appendChild(div); Event.observe(div, 'mousedown',function(){ gDown = div; }); Event.observe(document, 'mouseup',function(){ alert(gDown.id); gDown=false; }); //--></script> </body> </html> javascriptって値渡しだと思っていたので、期待した動作と異なります。参照渡しだと考えると納得できるのですが、javascriptって 参照渡し？それとも値渡し？ と混乱しています。 この辺のところを、教えてください。お願いいたします。
- ベストアンサー
- JavaScript
- javascriptの動的読み込みについて教えてください
javascriptの動的読み込みについて教えてください いつもお世話になります。 jqueryを勉強中のものです。 少しややこしいのですが、 以下のmenu.htmlとmain.htmlを持ったframe.htmlで、メニューの試験ボタンを押してmain.htmlの<div id="target_id">にload.htmlを動的に読み込んだ時、loadされたhelloボタンが作動しません。 menu.htmlのtest()中のalert(data);でload.htmlの<script>が読み込まれていることは確認できるのですが・・何が原因でどこが悪いのでしょうか？ よろしくご指導お願いします。 frame.html ----------------------------------------------------------- <html> <head> <title>Dynamic Load Test</title> </head> <frameset name="frame" cols="180,*"> <frame name="menu" src="menu.html"> <frame name="MainPanel" src="main.html"> </frameset> </html> ----------------------------------------------------------- menu.html ----------------------------------------------------------- <html> <head> <script src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"><!-- function test(){ jQuery.get("./load.html",function(data){ alert(data); $("#target_id",window.parent.MainPanel.document).html(data); }); } // --></script> </head> <body> <button onClick="test();">試験</button> </body> </html> ----------------------------------------------------------- main.html ----------------------------------------------------------- <html> <head> </head> <body> <h1>main.html</h1> </body> <div id="target_id"></div> </html> ----------------------------------------------------------- load.html ----------------------------------------------------------- <h1>load.html</h1> <script type="text/javascript"><!-- function hello(){ alert("こんにちわ"); } // --></script> <button onClick="hello();">hello</button> -----------------------------------------------------------
- ベストアンサー
- JavaScript
- javascriptについて教えてください。
divのボタンを作りたいと思い、調べながらjQueryを使う方法は以下のようにしたらいい事は分かったのですが、jQueryを使わずにしようと思い $(function(){ $("div").click(function(){ var x = this.id; alert(x); }); }); の部分を document.getElementsByTagName("div").onclick = function(){ var x = this.id; alert(x); }; としてみたのですが、うまくいきません。jQueryを使わずに同じようなボタンを作るにはどうしたらいいのでしょうか？ <!doctype html> <html> <head> <meta charset="UTF-8"> <title>無題ドキュメント</title> <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-2.1.4.min.js"></script> <script type="text/javascript" language="javascript"> $(function(){ $("div").click(function(){ var x = this.id; alert(x); }); }); </script> </head> <body> <div id="aaa" class="div_link">a</div> <div id="bbb" class="div_link">b</div> <div id="ccc" class="div_link">c</div> <div id="ddd" class="div_link">d</div> <div id="eee" class="div_link">e</div> </body> </html>
- ベストアンサー
- JavaScript
- HTML id名とjavascript変数名
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8" /> <title>test</title> <script type="text/javascript"> window.onload = function() { console.log('test' in window); test.addEventListener('click', function() { alert('click') }, false); }; </script> </head> <body> <div id="test">test</div> </body> </html> 何かすごい勘違いをしていたらお恥ずかしいのですが、 上のコードFIREFOX以外（IE、Chrome、safari）'true'でtestをクリックするとalertが 出るのですが、これって自動的にid名がグローバル変数になってるって ことなのでしょうか？？ id名と同じ名前で変数を宣言していて、ぶち当たりました。 どうぞよろしくお願いいたします。
- ベストアンサー
- JavaScript
- javascript 初心者です
javascript 初心者です 設定したグローバル変数を引数に指定したいのですが、うまくいきません。 下記のスクリプトのように書いてみたのですが、○が返ってきてしまいます。 どうすればうまくいくでしょうか？よろしくお願いします。 <html> <head> <script type="text/javascript"> <!-- i = false; function myFunc(hensu){ if(hensu){ alert("○"); } else{ alert("×"); } } --> </script> </head> <body> <p onclick="myFunc('i')">[btn]</p> </body> </html>
- ベストアンサー
- JavaScript
- Firefoxで入力値のチェック
テキストボックスへの入力値を即時でチェックし、値が不正だった場合はそのテキストボックスから抜けれないようにしたいと考えています。 以下のコードはIE6、Opera8.5では動作しましたが、Firefox1.5ではalertとselectはされるものの、focusがされず、結果テキストボックスから抜けてしまいます。 Firefoxで上記のことをするにはどうしたらよいのでしょうか。 <html> <head> <script type="text/javascript"> function validate(e){ var t = document.getElementById("txt1"); if(t.value == "a"){ alert("だめ！！"); if (e.preventDefault) { e.preventDefault(); } else { e.returnValue = false; } t.select(); t.focus(); return false; } } function bodyOnLoad(){ var t = document.getElementById("txt1"); addListener(t, "change", validate, false); } function addListener(e, evtname, func, foo){ if(e.addEventListener){ e.addEventListener(evtname, func, foo); }else if(e.attachEvent){ e.attachEvent("on" + evtname, func); } } </script> </head> <body onload="bodyOnLoad();"> <input type="text" id="txt1"> <input type="text" id="txt2"> </body> </html>
- 締切済み
- JavaScript
お礼
ありがとうございます。 結局のところ、論理値として評価して(Boolean型に変換して)trueを返す場合というのは ・空でない、 ・0でない数値 ・オブジェクト ・Infinity ・-Infinity の場合なんですね。 ありがとうございました。 認識あってますでしょうか？ (少し心配です。)