• ベストアンサー

JavaScriptのDebugが出来るソフト

お世話になります。 現在、JavaScriptとAjaxのプログラムを組みましたが、非常に細かいところの差異で上手く動いたり、動かなかったりします。 つきましては、JavaScript、Ajax、PHPでのプログラム作成においてDebugができるソフトがあればご紹介下さい。 【一例】 下記コードのcheckとcheck()の違いで上手くいきませんでした。 <html> <head> <meta http-equiv=content-type" content="text/html;charset=utf-8"> <title>Web_data_source</title> <script type="text/javascript"><!-- function getFile() { filename = prompt("test_web.txt","http://localhost/test_web.txt"); //filename = prompt("test_web.txt","http://www.yahoo.co.jp/"); if (!filename) return; xmlhttp = createXMLHttp(); // xmlhttp = xhtttp alert("OK1"); alert(xhttp); if (xhttp !=null) { //alert("ok2-4") xhttp.onreadystatechange = check;←ここの()有る無しで動きませんでした。 xhttp.open("GET",filename,true); //alert("OK2") xhttp.send(null); } //} function check() { if (xhttp.readyState == 4 && xhttp.status == 200) { document.aForm.tArea.value = xhttp.responseText; //document=xhttp.responseText; alert("OK"); }else{ alert("NG"); alert(xhttp.readyState); alert(xhttp.status); } } // XMLHttpオブジェクト作成 function createXMLHttp() { try { //return new ActiveXObject("Msxml2t.XMLHTTP"); //IE用 //alert("OK4"); xhttp= new XMLHttpRequest(); //Firefox用 alert("OK3"); }catch(e){ try { xhttp = new ActiveXObject("Msxml2t.XMLHTTP"); alert("OK3-1"); }catch(e2){ try { xhttp= new ActiveXObject("Microsoft.XMLHTTP") // return null; alert("OK3-2"); }catch(e3){ xhttp= null; } } } } } --></script> </head> <body> <form name="aForm"> <input type="button" value="get file" onClick="getFile()"><br> <textarea cols="40" rows="20" id="tArea"></textarea> </body> <html> 宜しくご回答頂けます様お願いします。

質問者が選んだベストアンサー

  • ベストアンサー
  • think49
  • ベストアンサー率59% (285/482)
回答No.3

> Firebugの使用方法を詳細に記してある参考書またはサイトをご存知でしたら ちょっと古いですが、下記記事が参考になると思います。 特集:Firefox 3とFirebugで始めるJavaScript開発｜gihyo.jp … 技術評論社 http://gihyo.jp/dev/feature/01/firebug JavaScript開発ツールの本命！ FirebugとAptana（1/3） － ＠IT http://www.atmarkit.co.jp/fwcr/rensai/freeauthoring04/freeauthoring04_1.html

その他の回答 (2)

  • think49
  • ベストアンサー率59% (285/482)
回答No.2

> つきましては、JavaScript、Ajax、PHPでのプログラム作成においてDebugができるソフトがあればご紹介下さい。 私は主にFirebugを使ってJavaScriptはデバッグしています。 他はあまり経験がないのです(一回は試すようにしています)が、Companion.JS はconsoleが使えるので重宝すると思います。 - Firebug - Google Chromeの [JavaScriptをデバッグ] - Dragonfly (Opera) - Companion.JS (IEアドオン) - DebugBar (IEアドオン) Firebug Japanese :: Firefox Add-ons https://addons.mozilla.org/ja/firefox/addon/5165 My DebugBar | CompanionJS / ConsoleAPI http://www.my-debugbar.com/wiki/CompanionJS/ConsoleAPI Opera Dragonfly 入門 (Japanese) - Opera Developer Community http://dev.opera.com/articles/view/opera-dragonfly-japanese/

new-OKWave
質問者

お礼

お礼が遅れまして申し訳ありません。 Firebugは私もインストールしているのですが、今ひとつ使い方が良く分かりません。 つきましては、重ね質問になり申し訳ありませんがFirebugの使用方法を詳細に記してある参考書またはサイトをご存知でしたらご紹介頂けます様お願いします。

回答No.1

> 下記コードのcheckとcheck()の違いで上手くいきませんでした。 関数を呼び出す（実行する）ときにカッコをつけます。 Ajaxの前に、JavaScriptの基本文法からやり直した方が良いと思います。 （checkとcheck()の違いだけわかっても、その先のDOMでつまづくと思うので) function plus(a, b){ var sum= a+b; alert(sum); } plus(2, 3); //カッコあり var tasu=plus; // カッコなし tasu(5, 4);

new-OKWave
質問者

お礼

お礼が遅れまして申し訳ありません。 参考書は初心者向けのものを５冊程購入して、比較読みしていたのですが、どれも同じような内容で部分的にしか役立っていません。 その為、文法については正式に習得しているとは言えない状態です。 ＞Ajaxの前に、JavaScriptの基本文法からやり直した方が良いと思います。 ⇒厳しいが的確なアドバイスを頂き本当に有り難うございます。 ご迷惑ついでになり申し訳ありませんが、推奨図書があればご紹介頂けます様お願いします。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • JavaScriptでの外部データの取り込みについて

    お世話になります。 JavaScriptにて外部fileデータ（c:test_web.txt)を取り込み、ブラウザーに設定した枠内に表示させたいのですが、上手くいきません。 本ソースは参考書のものをそのまま使っているのですが、枠内の表示がされません。 自分なりに調べたところ、外部データを取得できていない様です。 つきましては、下記ソースにて不具合点をご指摘、ご意見頂けます様お願いします。 【JavaScript】 <html> <head> <meta http-equiv=content-type" content="text/html;charset=utf-8"> <title>Web_data_source</title> <script type="text/javascript"><!-- function getFile() { filename = prompt("test_web.txt","c:test_web.txt"); if (!filename) return; xmlhttp=createXMLHttp(); if (xmlhttp) { xmlhttp.onreadystatechange = check(); xmlhttp.open("GET", filename,true); xmlhttp.send(null); } } function check() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { document.aForm.tArea.value = xmlhttp.responseText; } } // XMLHttpオブジェクト作成 function createXMLHttp() { try { return new ActiveXObject("Msxml2t.XMLHTTP"); }catch(e){ try { return new XMLHttpRequest(); }catch(e) { return null; } } return null; } --></script> </head> <body> <form name="aForm"> <input type="button" value="file_get" onClick="getFile()"><br> <textarea cols="40" rows="20" id="tArea"> </textarea><br> </body> <html> 【c:test_web.txt】 test ok 宜しくご回答を頂けます様お願いします。

  • DOMの種類を一覧できるサイト

    今はやりのAjax用関数で以下のようなものがあります。 function createXMLHttpRequest(){ var XMLhttpObject = null; try{ XMLhttpObject = new XMLHttpRequest(); }catch(e){ try{ XMLhttpObject = new ActiveXObject("Msxml2.XMLHTTP"); }catch(e){ try{ XMLhttpObject = new ActiveXObject("Microsoft.XMLHTTP"); }catch(e){ return null; } } } return XMLhttpObject; } IEやそれ以外のブラウザで利用可能なActiveXObject（DOM）を選択できるようになっていますが、ここで使われているMsxml2.XMLHTTPやMicrosoft.XMLHTTPのようなDOMがたくさんリストアップされているサイトを探しています。最初にこの関数を作った人はどうやってこれらのDOMを見つけたのか気になりますし、自分で似たような関数を作ってみたいので。どうか情報提供をお願いいたします。

  • XMLHttpRequestでキャッシュを使用させないようにしたい

    ある場所にonMouseoverで ツールチップのようにデータを XMLHttpRequestを使用して読み込み、表示しています。 読み込みは getPage('xxx.php?id=$id') というようにPHPを使用してDBを読み取り、 該当のIDの情報を読み出しているのですが、 この情報が編集されることがあります。 しかし、一回開いてしまうと、キャッシュが効いているのか、内容を編集しても編集後の内容を取ってくれません。 テストをした結果ブラウザを閉じるか、キャッシュを削除すれば又最新の情報を表示してくれるのですが、 読み込むごとに最新の情報にアクセスする（キャッシュを使用しない）方法はないでしょうか。 ブラウザはIEを使用しています。 よろしくお願いします。 以下ソース function getPage(pageURL) { document.charset='EUC-JP'; if(document.all){ rx = event.clientX + document.body.scrollLeft; ry = event.clientY + document.body.scrollTop; }else{ rx = NNX; ry = NNY; } xmlhttp = createXMLHttp(); if (xmlhttp) { xmlhttp.onreadystatechange = setPageData; xmlhttp.open('GET', pageURL,true); xmlhttp.send(null); }else{ alert("XMLHttpRequest失敗"); } } function setPageData() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { opentext( [xmlhttp.responseText] ,rx,ry); //↑表示用ルーチンに受け渡しているだけなので割愛 } } // XMLHttpsオブジェクト作成 function createXMLHttp() { try{ return new ActiveXObject ("Msxml2.XMLHTTP"); }catch(e){ try { return new ActiveXObject ("Microsoft.XMLHTTP"); }catch(e){ try { return new XMLHttpRequest(); }catch(e) { return null; } } } return null; }

  • Javascript の　.send　で　POST できません。

    こんにちは。 Javascriptで[aaa=bbb&ccc=ddd]というデータをPOSTしてみたいと思って以下のコードを書いてみたのですが、うまく動作しません。 どこが間違っているのでしょうか？ コメントもツッコミどころがあるかもしれませんが、ご指摘よろしくお願いいたします。 <html> <head> <script type="text/javascript"> <!-- var gActiveXObj = ""; function GetActiveXObject() { 　　　　if(window.ActiveXObject) 　　　　{ 　　　　　　　　try//IEのActiveXObject 　　　　　　　　{ 　　　　　　　　　　　　gActiveXObj = new ActiveXObject("Msxml2.XMLHTTP"); 　　　　　　　　}catch(exception){//IEの古いバージョン 　　　　　　　　　　　　try 　　　　　　　　　　　　{ 　　　　　　　　　　　　　　　　gActiveXObj = new ActiveXObject("Microsoft.XMLHTTP"); 　　　　　　　　　　　　}catch(exception2){ 　　　　　　　　　　　　　　　　return null; 　　　　　　　　　　　　} 　　　　　　　　} 　　　　} } function PostData() { 　　　　if(!gActiveXObj) 　　　　{ 　　　　　　　　GetActiveXObject(); 　　　　　　　　if(!gActiveXObj) 　　　　　　　　{ 　　　　　　　　　　　　alert('ご利用のブラウザではActiveXオブジェクトが取得できません。IEを使ってみて下さい'); 　　　　　　　　　　　　return null;　　　　 　　　　　　　　} 　　　　} 　　　　gActiveXObj.open('POST','test.php',true);//まだソケットはオープンしてない。メンバの設定してるだけ。 　　　　//パラメータは左から、メソッド、ファイル名、非同期通信を有効にするかどうか。 　　　　 　　　　gActiveXObj.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");//ヘッダを設定 　　　　gActiveXObj.send( "aaa=bbb&ccc=ddd" ); 　　　　if(gActiveXObj.status == 200) 　　　　{ 　　　　　　　　//サーバから受信完了:readyState = 4 メソッドの成功 : status = 200 　　　　　　　　alert('POST成功'); 　　　　}else{ 　　　　　　　　alert('readyState: + 'gActiveXObj.readyState); 　　　　　　　　alert('status:' + gActiveXObj.status); 　　　　} } // --> </script> </head> <body> <a href="javascript:PostData()">実験</a> </body> </html>

  • IE6 + javascript

    すみません、先ほども質問したのですが、締め切ってしまったのでもう一度質問させてください。 下記コードが、Firefoxでは動作するのですが、IEではjavasciptの部分が動作していません。 もちろん、javascriptの設定は有効にしてあります。 var browser = navigator.appName; if(browser.charAt(0) == "N") { window.addEventListener("load",change_page(page_id),false); } else if (browser.charAt(0) == "Ｍ") { window.attachEvent("onLoad",change_page(page_id)); } ．．．． function httpRequest() { if (window.ActiveXObject) { try { httpObj = new ActiveXObject("Microsoft.XMLHTTP"); } catch(e) { try { httpObj = new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) { httpObj = false; } } } else if (window.XMLHttpRequest){ try{ httpObj = new XMLHttpRequest(); } catch(e) { httpObj = false; } } return httpObj; } change_page()はfunctionです。 なぜIE6ではjavascriptが動かないのでしょう？ ソースのどこが悪いのかわからず、どなたかアドバイスあればお願いします！

  • javascriptで困っています。教えてください

    以下のようにjavascriptの内容を書いた外部のテキストファイルを読み込んで、実行しようとしているのですが、うまくいきません。普通にjavascriptを読み込むのは分かっているのですが、このような方法ができないのでしょうか？よろしくお願いします。 <!doctype html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>無題ドキュメント</title> </head> <body> <div id="jsbox"></div> <script type="text/javascript"> var jsbox = document.getElementById("jsbox"); //非同期通信///////////////////////////////////////////// var xmlHttp; loadText(); function loadText(){ if (window.XMLHttpRequest){ xmlHttp = new XMLHttpRequest(); }else{ if (window.ActiveXObject){ xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); }else{ xmlHttp = null; } } xmlHttp.onreadystatechange = checkStatus; xmlHttp.open("GET", "http://xxxxxxxxxxxx/js_test.txt", true); xmlHttp.send(null); } function checkStatus(){ if (xmlHttp.readyState == 4 && xmlHttp.status == 200){ var str = xmlHttp.responseText;alert(str); jsbox.innerHTML = str; test_js(); } } ///////////////////////////////////////////////////////////////// </script> </body> </html> テキストファイルをhttp://xxxxxxxxxxxx/js_test.txtに置き、テキストファイルの内容が <script type="text/javascript"> function test_js(){ alert("test"); } </script>

  • Ajax は NN でも使えますか？

    初歩的な質問ですみません。 Ajax の非同期通信で、XMLHTTP オブジェクトを作成するスクリプトを見ると、 function createXMLHttpRequest() { var XMLhttpObject = null; try{ XMLhttpObject = new XMLHttpRequest(); }catch(e){ try{ XMLhttpObject = new ActiveXObject("Msxml2.XMLHTTP"); }catch(e){ try{ XMLhttpObject = new ActiveXObject("Microsoft.XMLHTTP"); }catch(e){ return null; } } } return XMLhttpObject; } のように Microsoft のオブジェクトを読み込んでいるように見えるのですが、NN でもつかえるのでしょうか。 また、Macintosh との互換性はどうなのでしょうか。 ご存知の方はお教えください。

  • AJAXでサイト存在チェック時、スクリプトエラー

    AJAXを使用し、遷移したいサイトが存在する場合、その際サイトに遷移し、存在しない場合は、ほかのサイトに遷移するという処理を行いたいのですが、スクリプトエラーが発生しまい困っています。 遷移先をローカルサーバのリンクを指定するとうまくいくのですが、外部サーバのアドレスを指定するとエラーになってしまいます・・。何か制約があるのでしょうか？ また、ほかの方法で実現できるのであれば、教えてください。 現在記述しているソースの一部を下記に添付します。 <script language="JavaScript"　type="text/JavaScript"> <!-- function fucXMLHttpRequest(){ /* XMLHttpRequestオブジェクト作成 */ var xmlhttp = createXmlHttp(); xmlhttp.onreadystatechange = handleHttpEvent; function handleHttpEvent(){ if (xmlhttp.readyState == 4) { if (xmlhttp.status == 200) { 　　　　　 window.open("http://www.inte.co.jp/xxxx/xxxx"); } else { window.open("http://www.inte.co.jp/"); } } } xmlhttp.open("GET", "http://www.inte.co.jp/xxxx/xxxx" , true); xmlhttp.send(null); return false; } function createXmlHttp(){ if (window.XMLHttpRequest) { return new XMLHttpRequest(); } else if (window.ActiveXObject) { try { return new ActiveXObject("Msxml2.XMLHTTP"); } catch(e) { return new ActiveXObject("Microsoft.XMLHTTP"); } } else { return null; } } //--> </script> </head> <a href="#" onClick="fucXMLHttpRequest()">詳しくはこちら</a>

  • Ajaxでデータベース(PostgreSQL)

    を非同期で読み込むことができるでしょうか？ ファイルならば下記のようにすれば良いみたいですが データベースの場合のやり方がわかりません。 PostgreSQLのデータを読み込むにはどうしたら良いのでしょうか？ <script> var xmlHttp; function loadText() { if (window.XMLHttpRequest) { xmlHttp=new XMLHttpRequest(); } else { if(window.ActiveXObject) { xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); } else { xmlHttp = null; } } xmlHttp.onreadystatechange=checkStatus; xmlHttp.open("GET","plan.txt",true); xmlHttp.send(null); } function checkStatus() { if(xmlHttp.readyState==4 && xmlHttp.status==200) { alert(xmlHttp.responseText); } } </script> <form> <input type="button" value="read file" onClick="loadText()"> </form>

  • Ajaxを使いonMouseoverで説明表示をする

    以下の場合、opentext を直接開けば普通に開くのですが、 getPage で開くとエラーになってしまいます。 いろいろ試した結果 event.clientX がある場合エラーになるようです。 エラーがなく表示できるようになりませんでしょうか。 （文字数制限のためDIVタグ省略） function opentext(settxt){ divid="tiptext"; if(document.all){ d_div=document.all(divid); rx = event.clientX + document.body.scrollLeft +set_x; //rx = 100; ry = event.clientY + document.body.scrollTop +set_y; //ry = 100; }else{ d_div=document.getElementById(divid); rx = NNX + set_x; ry = NNY + set_y; } if(settxt){ d_div.style.display="block"; d_div.style.left = rx +"px"; d_div.style.top = ry +"px"; d_div.innerHTML = settxt; }else{ d_div.style.display="none"; d_div.innerHTML = ""; } } function MouseXY(NNevent){ NNX = NNevent.pageX; NNY = NNevent.pageY; } window.onmousemove = MouseXY;/* himajin.moo.jp */ function getPage(pageURL) { xmlhttp = createXMLHttp(); if (xmlhttp) { xmlhttp.onreadystatechange = setPageData; xmlhttp.open('GET', pageURL); xmlhttp.send(null); }else{ alert("XMLHttpRequest失敗"); } } function setPageData() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { //alert("XMLHttpRequest成功"); opentext([xmlhttp.responseText]); } } // XMLHttpsオブジェクト作成 function createXMLHttp() { try { return new ActiveXObject ("Microsoft.XMLHTTP"); }catch(e){ try { return new XMLHttpRequest(); }catch(e) { return null; } } return null; }

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する