- ベストアンサー
javascriptを起動した後のウェブページを取得するには
こんにちは。よろしくお願いいたします。 以下のようなHTMLソースをブラウザで読み込むとhogeと 表示されますが、PHPのfile_get_contentsやPerlのLWPなどを使って ページを取得するとソースそのものが取得されます。PHPやPerlを使って ブラウザから見たソース(以下の例ではhoge)を取得するには どのようにしたらよいのでしょうか？ <script type="text/javascript"> window.onload=function (){ document.getElementById("a").innerHTML="hoge"; } </script> <div id="a"></div>
- PHP
- 回答数2
- ありがとう数0
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
javascriptはブラウザ依存なので、PHP側で取得するのはかなり面倒 できないと思ってもらったほうがよいかも
その他の回答 (1)
できないと思います。 > 以下のようなHTMLソースをブラウザで読み込むとhogeと > 表示されますが、 それはブラウザのJavaScriptが有効だからです。 無効にしてしまえば、何も表示されませんよね。 スクリプトが取得できるのは、あくまでHRMLの出力結果で あってブラウザがどう表示したかは取得できないと思います。
関連するQ&A
- 【javascript】document.getElementByIdは一つしか使えないの？
以下をhtmlをブラウザで見ると、文字列"aaa"は表示されますが、"bbb"は表示されません。 <html> <head> <SCRIPT LANGUAGE='JavaScript1.2'><!-- function init(){ document.getElementById("a").innerHTML="aaa"; document.getElementById("b").innerHTML="bbb"; } //--></script> </head> <body onload="init()"> <div id="a"></dev> <div id="b"></dev> </body> </html> ブラウザはＩＥ，ＦＦと試しましたが共に同じ結果でした。 ＦＦのエラーコンソールには document.getElementById("b").innerHTML="bbb" is null のエラーメッセージが出てましたが、文法的に何が問題なのでしょうか？
- ベストアンサー
- JavaScript
- JavaScriptについて
<div id="hoge" style="border:1px solid;"></div> <script type="text/javascript"> //ウィンドウサイズの取得 getWindowSize(); // リサイズイベントの設定 window.onresize = getWindowSize; //ウィンドウサイズを取得する function getWindowSize() { ZZZ = window.innerWidth; AAA = ZZZ * 0.98; BBB = (ZZZ * 0.98) * 0.5625; document.getElementById("hoge").style.width = AAA + "px"; document.getElementById("hoge").style.height = BBB + "px"; } </script> 上記のようにブラウザのサイズが変更されたら<DIV>のサイズも変更するようなスクリプトですが、 別のJavaScriptで<div id="hoge" >の中に埋め込み型のプレイヤーを表示しています。 この時にブラウザのサイズを変更してもプレイヤーのサイズが変更されません。 ブラウザのサイズを変更 → 更新ボタンを押すとプレイヤーのサイズも変更されます。 例えば、リサイズされたら最初から読み直す（更新ボタンと同じ動作）にする場合はどうしたら良いでしょうか？
- 締切済み
- 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
- javascriptで2箇所のphpの関数を取得したいのです。
javascriptで2箇所のphpの関数を取得したいのです。 見よう見まねでやっている初心者です。よろしくお願いします。 javascriptにてphpの関数をよびだしてhtmlのinput type="text"に値を出力しようとしています。 ２か所のphp を下記のようにhtmlに書いて取得しようとしたのですがどちらか一方しか取得できません。 なんとか両方を読み込めるようにできないでしょうか？分かりにくい質問かと思いますので例を書いて見ましたのでどうかよろしくお願いいたします。 (例） <script type="text/javascript" src="../data/zzz.php?aaa=abc" ></script> <script type="text/javascript" src="../../../data/xxx.php?bbb=abc" ></script> 上記のように書いても片方しか取得しないようです。 以下../dataのzzz.phpのphｐです。 <?php $aaa = $_GET['aaa']; header("Content-type: application/x-javascript"); echo "window.onload = function () {"; if ($aaa== 'abb') {echo "document.getElementById(\"xxx\").value=100;","document.getElementById(\"yyy\").value=1;";} elseif ($aaa == 'abc') {echo "document.getElementById(\"tanka\").value=120;","document.getElementById(\"yyy\").value=2;";} echo "}"; ?> 以下../../../dataのxxx.phpのphｐです。（例） <?php $bbb = $_GET['bbb']; header("Content-type: application/x-javascript"); echo "window.onload = function () {"; if ($bbb== 'abb') {echo "document.getElementById(\"zzz\").value=50;","document.getElementById(\"vvv\").value=10;";} elseif ($bbb == 'abc') {echo "document.getElementById(\"tanka\").value=51;","document.getElementById(\"vvv\").value=20;";} echo "}"; ?> 以上２か所のディレクトリのphpを取得したいのですが、これはできない事なのでしょうか？ちがうディレクトリから取得しなければ更新作業が大変になってしまうのです。どうかよろしくお願いいたします。
- ベストアンサー
- PHP
- 1ページ内で複数のwindow.onload = functionの動作
Ajaxを使用して取得してきたRSSをinnerHTMLで表示するスクリプトを1ページ内に複数設置したいのですが、うまくいきません。 prototype.jsを使うと複数のonloadを制御できるという記事を参考にしたのですが、動作しませんでした。（WindowsIE6で検証してます） http://hori-uchi.com/archives/2005_09.html BODY以下のソースはこちらです。現状だとどちらか一つだけなら動作する感じです。これをどちらも動作する方法をご教授いただけませんでしょうか。宜しくお願いします。 //RSS取得1箇所目 <div id="p1">roading1</div><script> window.onload = function(){ var u = document.getElementsByTagName("head")[0].appendChild(document.createElement("script")); u.type = "text/javascript"; u.charset = "utf-8"; u.src = "http://###"; } var xml = {}; xml.onload = function(data){ var items1 = data.items; var g = "\n"; for(var i = 0; i < Math.min(items1.length, 20); i++){ // } document.getElementById("p1").innerHTML = g; } </script> //RSS取得2箇所目 <div id="p2">roading2</div><script> window.onload = function(){ var u = document.getElementsByTagName("head")[0].appendChild(document.createElement("script")); u.type = "text/javascript"; u.charset = "utf-8"; u.src = "http://***"; } var xml = {}; xml.onload = function(data){ var items2 = data.Result; var h = "\n"; for(var i = 0; i < Math.min(items2.length, 20); i++){ // } document.getElementById("p2").innerHTML = h; } </script>
- ベストアンサー
- JavaScript
- PHPとjavascriptを融合させたカウントダウンを作りたい
PHPとjavascriptを融合させたカウントダウンを作りたい 宜しくお願い致します。 現在、アクセスした時刻から時計が「0秒」を指すまでのカウントダウンを 表示させているのですが、 これを、PHPで取得したサーバー時刻を使ったカウントダウンにしたい と思っています。 現在、利用しているjavascriptは、 －－－－－－－－－－－－－－－－ <script type="text/javascript"> <!-- function tokei() { date=new Date(); second=date.getSeconds(); var str=60-second; document.getElementById("tokei").innerHTML=str; } //--> </script> <body onload="window.setInterval('tokei()',100)"> －－－－－－－－－－－－－－－－ なのですが、これを、 －－－－－－－－－－－－－－－－ <script type="text/javascript"> <!-- function tokei() { second=<?php print date(s) ?>; var str=60-second; document.getElementById("tokei").innerHTML=str; } //--> </script> <body onload="window.setInterval('tokei()',100)"> －－－－－－－－－－－－－－－－ というイメージでカウントダウンさせたいのですが、 何か方法はございますでしょうか？それともPHPを利用する時点で 不可能な話でしょうか？ (試しに後述のスクリプトを実践してみた所、案の定PHPで取得した秒で カウントダウンは止まってしまいます) それでは宜しくお願い致します。
- ベストアンサー
- JavaScript
- googleマップAPIにて緯度経度に加えてズームレベルを取得する方法がわかりません
こんにちは、いつもお世話になっています <head> <script src="http://maps.google.com/maps?file=api&v=2&key=googleマップキー" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> //<![CDATA[ function onGMapClick(overlay, point) { if (point) { var request = GXmlHttp.create(); var url = "/php/date.php" + "?x=" + point.x + "&y=" + point.y; request.open("GET", url, true); request.onreadystatechange = function() { if (request.readyState == 4) { var xmlDoc = request.responseXML; var xy = xmlDoc.documentElement.getElementsByTagName("xy"); document.getElementById("show_x").innerHTML = xy[0].getAttribute("x"); document.getElementById("show_y").innerHTML = xy[0].getAttribute("y"); } } request.send(null); } } function onLoad() { var map = new GMap2(document.getElementById("map")); map.addControl(new GSmallMapControl()); map.addControl(new GMapTypeControl()); map.setCenter(new GLatLng(36.03, 139.15), 13); GEvent.addListener(map, 'click', onGMapClick); } //]]> </script> </head> <body onload="onLoad()"> <div id="map" style="width:450px; height:450px"></div> <P>x : <div id="show_x"></div></P> <P>y : <div id="show_y"></div></P> </body> http://www.geekpage.jp/web/google-maps-api/gxmlhttp-5.php ここのサイトのソースを参考にgoogleマップAPIを利用したサイトを制作しています 経度、緯度の取得はできたのですが、残りのズームレベルの取得がいろいろ試してみましたができません このソースで「経度」「緯度」「ズームレベル」を取得して、変数urlに格納された/php/date.phpにデータを渡したいのですが、現在のズームレベルですら取得できない有様です どなたか教えていただけないでしょうか
- ベストアンサー
- JavaScript
- 各ページごとにjsで表示内容を変更したい
ページごとにディレクトリ名を判別して表示内容を変更するスクリプトを書きたいのですが、現状ieでのみ動作が不安定です。yuga.jsに組み込む形で記述しています。 //script------------------------ var filePath = location.href; var a = filePath.split('://'); schema = a[0]; var d = a[1].split('/'); host = d.shift(); var f = d.pop(); var dirs = d; if(dirs == 'hoge'){ var target = '<li><a href="..\/hoge\/index.html">hoge1<\/a><\/li>' + '<li><a href="..\/hoge\/hoge2.html">hoge2<\/a><\/li>' + '<li><a href="..\/hoge\/hoge3.html">hoge3<\/a><\/li>' } document.getElementById('listWrap').lastChild.innerHTML(target); //html----------------------------- <div id="listWrap"> <img src="./images/listTitle.jpg" alt="" width="**" height="**" /> <ul id="list"></ul> </div> 上記スクリプトを外部から読み込んでonloadで実行していますが、ieでは document.getElementById('listWrap')がnullを返すことが多く、表示される場合とされない場合があります。 ご教授よろしくお願いします。
- ベストアンサー
- JavaScript
- javascriptで困っています。
以下のような、現在地を取得するhtmlコンテンツを作ったのですが、スマホによってきちんと取得できたり、Failed to start Geolocation serviceというメッセージが出たりします。いずれの場合もGPSはオンにしています。メッセージが出るのはブラウザーの影響とか何かあるのでしょうか？ブラウザーがサポートしていない場合はLocation APIがサポートされていません。と表示するようにしているのですが、Failed to start Geolocation serviceが出る原因が分かりません。ご存知の方がいらっしゃいましたら、教えてください。よろしくお願いします。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8" /> <title>現在地取得</title> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <style> #map { width: 480px; height: 640px; border: solid 1px #ccc; } </style> </head> <body> <h1>Location API サンプル</h1> <div id="map"></div> <div id="message"></div> <script> window.onload =function() { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(function(position) { var latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude); var options = { zoom: 15, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById('map'), options); var marker = new google.maps.Marker({ position: latlng, map: map, title: '現在地' }); }, function(e) { document.getElementById('message').innerHTML = typeof e == 'string' ? e : e.message; }); } else { document.getElementById('message').innerHTML = 'Location APIがサポートされていません。'; } }; </script> </body> </html>
- 締切済み
- JavaScript
- window.openで開いたページに書き込みたい
<html> <script language="javascript"><!-- function startIE(jpURL) { var newWindow = window.open(jpURL, null, 'width=500,toolbar=yes,menubar=yes,scrollbars=yes'); newWindow.onload = function() { alert("ページが読み込まれました！");// ここに読み込みが完了したら実行したい処理を記述する var NAIYOU=document.getElementById('NAIYOU'); var Kakikomi=newWindow.document.getElementByName('p'); Kakikomi.innerHTML= NAIYOU.innerHTML; } } // --></script> <a href="javascript:startIE('https://www.yahoo.co.jp/')">IE起動</a> <div id="NAIYO">ああああああああああああああああああああああああ</div> </html> ------------------------------------- divの内容は自動で色々変更するようにしていますが 参考として上記のようにしました。 ボタンを押してブラウザを起動したら、Yahooを開き 「あああああああああああ」を検索ボックスに入れたいと思っています。 しかし、ロードが終わっていない状況だからから 書き込むことが出来ません。 OnLoadを組み込んでみましたが、以下のようなエラーが出ます。 Uncaught DOMException: Blocked a frame with origin "null" from accessing a cross-origin frame. Chromeの拡張機能にしたら出来るようになるのでしょうか? お手数をおかけしますが、回答よろしくお願いいたします。
- ベストアンサー
- JavaScript
