ChromeのJS Consoleでの検索（「$ x（...）」）は、HTMLテキスト（DOM要素）のセクションではなく配列（jQueryオブジェクト？）を出力します

XPathはこの種のプログラミングを一般的に検索しますので、間違った用語やあいまいな説明をお許しください。私は以下のスクリーンショットで、自分の制限された語彙で説明できるより簡単に私が話していることを実証すると思います。私は、私はXPathを検索するために、開発者ツールを使用し始めたとき、「$ X（...）」機能を使用すると、HTMLの部分を返します

探しているんだ何

私はその後、コンソール内でナビゲートするか、より具体的な検索を行って、テキストを抽出する前に構造の感覚を得ることができました。私のコンソールは、このフォームでマークアップテキストを返すことはもはやありませんが、私は私が探しているリターンの種類を示すために十分であろう別のStackOverflowのポストに例を見つけました：

What I would be looking for

私がすることができました私は今

を見ている何

など、より具体的なXPathを使用する前に、私は必要な部分を見つけるために、（セクションを強調表示）コンソール内このHTMLテキストをナビゲート抽出

私が今得意にしているのは、配列または配列のネストされたセットです。私はこれらがjQueryオブジェクトが返されていると考えています（ここでは途方もない可能性があります）。以下を参照してください：

What I'm seeing now

私は多くの場合、この配列の要素をナビゲートすることは、実際にHTMLを通じて働くより容易になることができると確信していると、Web開発にはほとんど露出を持つ人として、私は」私がここで欠けているものがあることを確かめてください。ページ上の特定の要素やテキストを探しているだけの掻き集めプロジェクトに取り組んでいる人。これははるかに扱いにくいです。 ...作っ例として

は、過去に、私はページの外の果物の異なる種類の名前を引くしようとしていた場合、私は、コンソールに入力された

$x('//*[@class="fruit"]/h1')

...コンソールのような何か吐き出すだろう：

[<h1>Peach</h1>, <h1>Strawberry</h1>, <h1>Watermelon</h1>, <h1>Apple</h1>, <h1>Orange</h1>]

をそして、私は...
とそれをフォローアップしていました
...コンソールを吐き出すだろう：

["Peach", "Strawberry", "Watermelon", "Apple", "Orange"]

を今、私はこのような検索を実行する場合、私は（ない文字通り、この形で）になります結果を得るでしょうこのように：私はそのXPathの検索から取得していますまさに、私はと仕事をしなければならないするつもりです何を確認することができますので、私の目的のために

Array[2]0: form#aspnetForm0: input#__LASTFOCUS1: input#__EVENTTARGET2: input#__EVENTARGUMENT3: input#EktronClientManager4: input#__VIEWSTATE5: input#__VIEWSTATEGENERATOR6: input#__EVENTVALIDATION7: input#ctl00_Header_searchTextBox.searchterm8: input#ctl00_Header_searchButton.searchbtn9: fieldset10: input#ctl00_contentPlaceHolder_login_emailTextBox.max-width11: input#ctl00_contentPlaceHolder_login_passwordTextBox.max-width12: input#ctl00_contentPlaceHolder_login_rememberMeCheckBox13: input#ctl00_contentPlaceHolder_login_signInButton.button.green_events: etc, etc...

、文字列の配列は、で作業する方がはるかに簡単です一度私はサイトから要素を取得します。

私は大きな画像や語彙の多くの両方を欠けているため、この記事は、おそらく経験豊富なウェブプログラマーには本当にイライラさせられることごめんなさい。誰かが私に説明してもらえますか？私は何をしていますか？前にHTMLテキストを取得していたときに、これらの配列にデータがいっぱいになるのはなぜですか？2. JavaScriptコンソールでこの種の検索を実行するとHTMLテキストを返す方法に戻す方法は？

ありがとうございました！

出典

2016-12-07 slearner