• ベストアンサー

デベロッパーツールでHTML構成が確認できません

スクレイピングするため、このサイトのHTML構成を確認しようと思ったのですが、添付画像のようにエラーが発生します。 https://data.wingarc.com/scraping-27053 このサイトを見ながら記事のタイトルの情報をスクレイピングしようと思ったのですが、セレクトボタンを押し、スクレイピングしたい範囲を選択しても、手に入れたいデータを指定するタグが見つかりません。マウスカーソルの左上部分に四角い枠が表示されるのですが、この中に目的の情報があるのでしょうか?

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

  • ベストアンサー
  • 4017B
  • ベストアンサー率73% (1304/1775)
回答No.1

質問者が開いているのは [コンソール] になので、これはJS実行時などにシステム側から返されるエラーメッセージ等が一覧表示されるウィンドウです。そのwebページのHTMLタグ等を確認するためには、[要素] という名前のタブ(ウィンドウ)を開けば、いわゆるそのwebページを構成しているHTMLタグを見る事が出来ます。 通常はDefaultなら、ブラウザの [デベロッパーモード:F12] に入ると最初は [要素] がアクティブウィンドウになっているはずですが…何か余計な操作でもしましたか?しかも質問者の環境、何故か [コンソール] 以外のタブが全て非表示になっていますね。ちょっと変です。 とりあえず "MS Edge: DevTools" で行くのであれば、[コンソール] の右に表示されている + をクリックすれば、その他のメニュータブの一覧がずらっと表示されますので。その中から [要素] を選んでみてください。恐らく一番下にあると思いますが…もし無かったら "詰み" ですね。 P.S. 解説記事では「ブラウザはGoogle Chromeを使います」と書いてあるのだから、最低限その通りにして貰わないと最初から詰んでしまい回復不可能になります。 たまに居ますよね。RPGとかの最初の "はじまりの町" でゲーム開始時に「まちを出たら南に行くのじゃ」と言われているのに、何故か無視してズンズンと上に行って倒せない敵に出会って即ゲームオーバーになるのを何回も繰り返す人…言葉は通じるのに話が通じない人(笑)。ま、今後も道中、お気をつけて。

hf-sbf5
質問者

お礼

使用するブラウザの種類がそんなに重要だとは思いませんでした。回答ありがとうございます。

その他の回答 (1)

回答No.2

先の方と同じ回答になっちゃいますが。 console画面とelement画面がごっちゃ^^ まず、言われた通りやってみよう~って 思ったのを先の方がすでに書いてて、 正直その通りだなと。

関連するQ&A

  • サイトのHTML要素取得(デベロッパーツール)

    Google chrome のデベロッパーツールについて教えて下さい。 サイトのログイン画面上、セレクトモードにて、ID&PWの入力フォームの要素は確認できるのですが、同じ画面内のログインボタンにポインタを合わせても、ログインボタンの要素は表示されず、canvasタグ情報しか表示されません。 どうにかログインボタンの要素を確認する方法はないでしょうか? セレクトモードでID&PWの入力フォームにポインタを当てた場合、フォームのみにフォーカスされ、要素情報が表示されます。しかしログインボタン含め入力フォーム以外にポインタを持っていくと、画面全体にフォーカスされ、canvasタグ情報が表示されます。もちろんログインボタンは押せる(機能している)ので、固有のタグが表示されるはずと思っていますが、されません。 手前のcanvasタブを何らかの方法で消すか、無視して奥のタブ情報を取得したいと思っています。

  • スタイルシートをHTMLタグの中に書きたい。

    初めまして、こんにちは。 Jugemにて、ブログをやっています。 ブログのテンプーレトには、CSSファイルとHTMLファイルがあり、 ページの全体的なCSS/HTMLは変更することが出来るのですが、 1つ1つの記事に対して、HTMLタグの中にスタイルシートを 組み込んでいるタイプのタグを使用したいと思って、 HTML/CSSのサイトを見て、試行錯誤やってはみたのですが、 HTMLタグに組み込むソースの書き方や詳細な情報が見つけられずに 困っています。 どなたか、このHTMLタグにCSSを組み込むタグ一覧と詳細な書き方が 記載されているweb siteをご存知ありませんでしょうか? どうぞ、ご回答のほうよろしくお願いいたしますm(_ _)m

  • これをHTMLで作るには・・・ どうすればいいのでしょうか?

    これをHTMLで作るには・・・ どうすればいいのでしょうか? 法人税の別表1-1(添付の画像)のインターフェースをHTMLとCSSで作ることになりました。 あくまでもデザインとコーディングの仕事なんですがどう作っていいのかわかりません。 ※プログラムは別の人間が作っています。 縦書きの部分があったり、 tableの縦が合わなかったりと困っています。 一応自分で考えているのは (1)入力項目や枠を背景画像にして 入力場所をフォームでpositionで指定していく (2)全部をtableタグで書く それ以外にいい方法があれば、是非お願いします

    • ベストアンサー
    • HTML
  • 省略できるHTMLについて

    今、Dreamweaverでホームページを作ってるのですが、無駄なタグなどがあって困ってます。 省略できるHTMLについて検索して探して見ましたが、そういうサイトが見つかりませんでした。 省略できるHTMLの情報が載ってるサイトや書籍があったら教えてください やっぱし手打ちのほうがいいのですかね?

    • ベストアンサー
    • HTML
  • 既存のHTMLで構成されたサイトも含めてCMSで管理したいと思ってます。

    既存のHTMLで構成された複数サイトを管理できるポータルサイト的なサイトをCMSで作ろうとしております。 既存の新着情報を更新すると、ポータルサイト的なサイトのトップページの新着情報も自動的に更新されるような感じです。 できれば、CSSが使えると尚いいのですが…。 何か良いCMSがあれば紹介してください。 よろしくお願い致します。

  • SGMLもHTML

    SGMLもHTMLの様に、サイトを作るためのタグなのですか? ググったら、「電子情報の出版、移行に関する国際規準。」との事でした。

    • ベストアンサー
    • HTML
  • HTMLでゲームができるってどういうこと?

    ずいぶん前からFlashの提供が終わるからとか脆弱性がどうのだとかで、FlashゲームはHTML5に乗り換えるべしみたいな記事や掲示板の書き込みやらをよく見かけました。 ずっと分からないのが、なんでHTML? え? HTMLってテキストにマーク付けるだけのものじゃないの? しょせん装飾した文字ですよね? Flashみたいにゲームができるって訳わかめってな感じです。 僕もサイトを作ったことはありますし、HTML4は古いからと聞いてHTML5で作りました。 でもHTML5だと宣言する部分だとかヘッダ部分だとか書き方や使えるタグがちょっと違うだけで、やはりHTMLはHTMLで4とはあまり違いが分かりませんでした。 文字に印を付けたら、ブラウザが取り決め通りにその文字を大きくしたり色を付けたりして表示してくれる。 ただそれだけ それがHTMLだと思ってました。 動的なページにしたければPHPやJavaScriptなどを利用するしかないと。 それが動的などころかゲーム!? いったいどういうことなんでしょうか? 別途、ゲームのファイルなどを用意しておいて、それを読み込んでゲームさせるって事? でもそれだと「HTML5でゲームができる」とは言えませんよね? 読み込んでるだけなんですから。 HTML5の書き方などを説明しているサイトを覗いてみても、やはりマークアップの方法しかなくて、ゲームを作る方法なんて載ってませんでした。 HTML5はもうPHPやJavaScriptなどを使わなくても、PHPやJavaScriptを使っているかのような動的なサイトを作ることができると言うことなでしょうか? さらにFlashのようなゲームまで? 本格的にHTML5を身につけたら、もうPHPやJavaScriptは必要ないんですか? HTML5とCSSとデータ管理用にMySQL当たりを覚えていれば、普通のサイトからゲームまで何でも作れるんでしょうか? HTMLでゲームを作れるってどういう仕組みなの?

    • ベストアンサー
    • HTML
  • マウスカーソルを画像や文字に重ねるとカーソルのすぐ右下に画像を表示する

    マウスカーソルを画像や文字に重ねるとカーソルのすぐ右下に画像を表示するようにしたいのですが、どのようなHTMLタグやjavascriptを使えばいいですか?

  • マウスカーソルについてくる前に左上にいってしまう。

    こんにちは。 マウスカーソルについてくるムービークリップをマスクにして使用したいため、 目的のムービークリップに onClipEvent (enterFrame) { _x += _xmouse/3; _y += _ymouse/3; } というActionScriptを入れました。 きちんと思うように動くのですが、 読み込んだあと、一瞬まず左上に移動してしまいます。 マウスカーソルをうごかして、はじめてマウスカーソルに近づいてきます。 左上に移動してしまうのは格好が悪いので、配置した位置からマウスカーソルに近づいて欲しいのですが、色々調べてもその説明がありません。 どうかよろしくお願いいたします。

    • ベストアンサー
    • Flash
  • HTML5 Canvasそのものの原点の指定方法

    お世話になります HTML5のcanvasタグについて教えてください 例えば <canvas id="target" style="border: 5px solid gray" width="200" height="400"></canvas> と書くと200[px]x400[px]の枠が付いたキャンバスがウィンドウの左上の隅の方にできるかと思います。 このキャンバス枠をウィンドウの真ん中あたりに表示させたいので Canvasの原点をずらしたいのですが、どうやったらいいのでしょうか ご回答くださいますようお願いします

    • ベストアンサー
    • HTML