トラバーステキストノードは

var history = document.getElementById('tooltip') 
 
    
 
console.log(history)

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
    <span id="tooltip"> 
 
    26 Sep, 17:01 <strong>2.25</strong> <span class="plus">+0.10</span><br> 
 
    26 Sep, 16:46 <strong>2.15</strong> <span class="plus">+0.10</span><br> 
 
    26 Sep, 12:32 <strong>2.05</strong> <span class="minus">-0.20</span><br> 
 
    25 Sep, 13:30 <strong>2.25</strong> <span class="plus">+0.05</span><br> 
 
    <br>Opening:<br>25 Sep, 02:28 <strong>2.20</strong><br> 
 
    </span> 
 
</body> 
 
</html>

は、私は、ID tooltipとスパンから情報を取得しようと、いくつかの構造化されたJavaScriptのオブジェクトにそれを持って来ます。残念ながら、私はjQueryを使用することはできません。（これはnightmare.jsの評価を持つ注入コードです）。

コンソールはhttps://www.w3schools.com/jsref/obj_history.asp

機能getElementByIdように私には見えます

[object History] { 
    back: function back() { [native code] }, 
    forward: function forward() { [native code] }, 
    go: function go() { [native code] }, 
    length: 4, 
    pushState: function pushState() { [native code] }, 
    replaceState: function replaceState() { [native code] }, 
    scrollRestoration: "auto", 
    state: null 
}

が要素を返す必要が返すので、私はその子ノードを横断し、このような何かにデータを収集できます。

[ 
    {date: '26 Sep, 17:01', value: 2.25, change: 0.10 }, 
    {date: '26 Sep, 16:46', value: 2.15, change: 0.10 } 
    // ... 
]

出典

2017-09-26 user3568719

定かではない何か質問はありますか？なぜあなたは 'history'を識別子として使うのですか？ 'console.log（history）'は 'window.history'オブジェクトを参照しているようです。 'var history = document.getElementById（ 'tooltip'）を変更するとどうなるのですか？ console.log（history）'に 'var _history = document.getElementById（ 'ツールチップ'） console.log（_history）'？ – guest271314

'＃tooltip'の書式を変更することは可能ですか？もしそうなら、それはずっと簡単になります。そして、 "Opening"行が出力に含まれるべきですか？ –

'window.history'は読み取り専用です。 https://developer.mozilla.org/en-US/docs/Web/API/Window/historyを参照してください。 – david25272

regexが必要な場合フォームのツールチップからデータを取得するあなたがしたいことはありません。

各行を3つの異なるグループに分割する式/([a-zA-Z0-9,: ]+) ([0-9.]+) ([0-9+\-.]+)/gを定義しました。

([a-zA-Z0-9,: ]+)
([0-9.]+)が値
([0-9+\-.]+)に関し、あなたの日付に関係が第三グループに変更

に関し、私はあなたのことを推測していますので、私は+/-を保ちましたおそらく変化が肯定的であるか否定的であったかを把握したいと思うでしょうあなたがしたくない場合は、3番目のグループを[+|-]([0-9.]+)に変更することができます。

const re = RegExp(/([a-zA-Z0-9,: ]+) ([0-9.]+) ([0-9+\-.]+)/g); 

const tooltip = document.getElementById('tooltip'); 

// get the outerText of the tooltip element 

const data = []; 

while (item = re.exec(tooltip.outerText)) { 
    data.push({ 
    date: item[1], 
    value: item[2], 
    change: item[3] 
    }); 
} 

/** [[object Object] { 
    change: "+0.10", 
    date: "26 Sep, 17:01", 
    value: "2.25" 
}, [object Object] { 
    change: "+0.10", 
    date: "26 Sep, 16:46", 
    value: "2.15" 
}, [object Object] { 
    change: "-0.20", 
    date: "26 Sep, 12:32", 
    value: "2.05" 
}, [object Object] { 
    change: "+0.05", 
    date: "25 Sep, 13:30", 
    value: "2.25" 
}] **/ 

console.log(data);

https://jsbin.com/dovahum/edit?html,js,console

出典

2017-09-26 21:59:21 kyle

これはこれまでの中で最も愚かな解決策のようですが、ちょっと... あなたは私がする必要があります変数名を変更する！

var myHistory = document.getElementById('tooltip') 
 
    
 
console.log(myHistory)

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
    <span id="tooltip"> 
 
    26 Sep, 17:01 <strong>2.25</strong> <span class="plus">+0.10</span><br> 
 
    26 Sep, 16:46 <strong>2.15</strong> <span class="plus">+0.10</span><br> 
 
    26 Sep, 12:32 <strong>2.05</strong> <span class="minus">-0.20</span><br> 
 
    25 Sep, 13:30 <strong>2.25</strong> <span class="plus">+0.05</span><br> 
 
    <br>Opening:<br>25 Sep, 02:28 <strong>2.20</strong><br> 
 
    </span> 
 
</body> 
 
</html>

historyあなたの割り当てはただ何もしないので、読み取り専用のグローバルオブジェクトです。上記の例のように変数名を変更する以外は、スクリプトがローカルスコープで実行され、グローバルスコープで実行されていないことを確認することがより構造的なソリューションになります。これを行うには

ワン実証済みのテスト方法は、あなたが本当にあなたのコードの前後どちらかの生命維持のを使用して外の習慣を作るべきimmediately invoked function expression (IIFE)

(function(){ 
 
var history = document.getElementById('tooltip') 
 
    
 
console.log(history) 
 
})() // <-- immediately invoke the function here!

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
    <span id="tooltip"> 
 
    26 Sep, 17:01 <strong>2.25</strong> <span class="plus">+0.10</span><br> 
 
    26 Sep, 16:46 <strong>2.15</strong> <span class="plus">+0.10</span><br> 
 
    26 Sep, 12:32 <strong>2.05</strong> <span class="minus">-0.20</span><br> 
 
    25 Sep, 13:30 <strong>2.25</strong> <span class="plus">+0.05</span><br> 
 
    <br>Opening:<br>25 Sep, 02:28 <strong>2.20</strong><br> 
 
    </span> 
 
</body> 
 
</html>

にあなたのコードをラップすることですまたはより高度なモジュールシステムを使用して、コードが決してがグローバルスコープで実行されていないことを確認します。それ以外の場合は、グローバルスコープの変数に割り当てるたびに、ウィンドウオブジェクトにプロパティを実際に追加しています！それはJavascriptの暗い側面の1つですが、私たちはそれと一緒に生きなければなりません。

var x = 10 
 
console.info(window.x)

は、いっそのこと、私は this article by Douglas Crockford、またはを読むことをお勧めします「プライベート」変数や他のより高度なJSのトピックを作成し、スコーピングのために無名関数を使用しての詳細については、彼の本 Javascript, the good partsを注文します。非常に良い読書imho。

（私はこの本を推薦する政策に反対するのではない願っています。それがあるかどうかを編集することはお気軽に。）

出典

2017-09-26 21:36:40

あなたはこれを意味しますか？スペース上の改行

スプリットでおそらく予約語

スプリットから

変更変数名あなたは部品を使用でき

var tt = document.getElementById('tooltip') 
 
    
 
console.log(tt.innerText.split("\n"))

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <title>JS Bin</title> 
 
</head> 
 
<body> 
 
    <span id="tooltip"> 
 
    26 Sep, 17:01 <strong>2.25</strong> <span class="plus">+0.10</span><br> 
 
    26 Sep, 16:46 <strong>2.15</strong> <span class="plus">+0.10</span><br> 
 
    26 Sep, 12:32 <strong>2.05</strong> <span class="minus">-0.20</span><br> 
 
    25 Sep, 13:30 <strong>2.25</strong> <span class="plus">+0.05</span><br> 
 
    <br>Opening:<br>25 Sep, 02:28 <strong>2.20</strong><br> 
 
    </span> 
 
</body> 
 
</html>

出典

2017-09-26 21:37:35 mplungjan

トラバーステキストノードは

答えて

関連する問題