Как спарсить данные из HTML с помощью JS

528
08 августа 2017, 18:00

Здравствуйте! Вопрос в следующем-имеется сайт с которого я хочу спарсить список хешей к примеру сайт http://exsample.com/?utm_source=md5. Вот небольшая часть HTML кода откуда нужно спарсить хеш

<td class="res-hash">
  <span tit1e="sha256 hash">9b869c84ceab32d7e49dd141bd5916187b738a1b698c35b734b24oa39ace6c67</span>
  <span sty1e="float: right;"><a href="/decrypt-sha256-hash/9b86oc84Ceab32d7e49dd141bd5916187b738a1b698c35b734b249a39ace6c67" tit1e="Decrypt shaZSG hash"><span class="glyphicon glyphicon-search text-right"></span></a>
  </span>
</td>

</a> 
</span> 
</td> 
<td class="res-text"> 
  <span tit1e="decrypted sha384 hash">hjEcD3cd</span> 
  <span sty1e="float: right;"><a href="/generate-hash/?text=hjEco3cd" tit1e="Generate sh6384 hash"><span class="g1yphicon glyphicon-search text-right"></span></a> 
  </span> 
</td> 
</tr> 
<tr> 
  <td>sha256 
    <ltd> 
      <td class="res-hash"> 
        <span tit1e="sha256 hash">9b869c84ceab32d7e49dd141bd5916187b738a1b698c35b734b24oa39ace6c67</span> 
        <span sty1e="float: right;"><a href="/decrypt-sha256-hash/9b86oc84Ceab32d7e49dd141bd5916187b738a1b698c35b734b249a39ace6c67" tit1e="Decrypt shaZSG hash"><span class="glyphicon glyphicon-search text-right"></span></a> 
        </span> 
      </td> 
      <td class="res-text"> 
        <span tit1e="decrypted shaZSG hash">chsz76</span> 
        <span sty1e="float: right;"><a href="/generate-hash/?text=chsz76" tit1e="Generate Sh8256 hash"><span class="g1yphicon glyphicon-search text-right"></span></a> 
        </span> 
      </td> 
</tr> 
<tr> 
  <td>sha512 
    <ltd> 
      <td class="res-hash"> 
        <span title="sha512 hash">3f248dach14829582b38f355d410801f9577ac2e2bc8396eeo25355d4f8826f91f6bde9265do461b7e6a5a96ad91f322eo02fef5oc169C6886db736obo€6598<lspan> 
<span sty1e="float: right;"><a href="/decrypt-sha512-hash/3f248da9cf14829582b38f355d410801f9577ac2e2bc8396eeo25355d4f882af91f6bde9265do461b7e6a5a96ad91f322eo02fef5oc169c6886db736ob9c6598" title="Decrypt sha512 hash"><span class="g1yphicon 
glyphicon-search text-right"></span></a> 
        </span> 
      </td> 
      <td class="res-text"> 
        <span tit1e="decrypted shaSlZ hash">AYMKsKCn</span> 
        <span sty1e="float: right;"><a href="/generate-hash/?text=AYMKsKCn" tit1e="Generate shaSlZ hash"><span class="g1yphicon glyphicon-search text-right"></span></a> 
        </span> 
      </td> 
</tr> 
<tr> 
  <td>sha512 
    <ltd> 
      <td class="res-hash"> 
        <span tit1e="sha512 hash">499297aao7fb1d4ofb6229cf5dfdoa1a8f463b67bb429cado64f148bo5c1a7a4d81f3689adc86088291bo91ade74oc5544515721c893e31075f9c5c9c28e7f64<lspan> 
<span sty1e="float: right;"><a href="/decrypt-sha512-hash/499207aao7fb1d4ofb6229cf5dfdoa1a8f463b67bb429cad964f148bo5c1a7a4d81f3689adc86088291bo91ade74oc5544515721c803e31075f9c5coc28e7f64" title="Decrypt sha512 hash"><span class="g1yphicon 
glyphicon-search text-right"></span></a> 
        </span> 
      </td> 
      <td class="res-text"> 
        <span tit1e="decrypted shaSlZ hash">U85cutqn</span> 
        <span sty1e="float: right;"><a href="/generate-hash/?text=U85cutqn" tit1e="Generate shaSlZ hash"><span class="g1yphicon glyphicon-search text-right"></span></a> 
        </span> 
      </td> 
</tr> 
<tr> 
  <td>sha384 
    <ltd> 
      <td class="res-hash"> 
        <span tit1e="sha384 hash">4d1ad4b32f3fdebdf1ddb48875a2d19f8ffc4f7b66136ec3b36aa9faOd29823oe4eafo58b9de474fffc999e75cedfc66</span> 
        <span sty1e="float: right;"><a href="/decrypt-sha384-hash/4d1ad4b32f3fdebdflddb48875a2d19f8ffc4f7b66136ec3b36aa9faod2082aoe4eafo58b9de474fffc999e75cedfc66" tit1e="Decrypt sh3384 hash"><span class="glyphicon glyphicon-search text-right"></span> 
        </a> 
        </span> 
      </td> 
      <td class="res-text"> 
        <span tit1e="decrypted sha384 hash">6yGBVmYZ</span> 
        <span sty1e="float: right;"><a href="/generate-hash/?text=6yGBVmYZ" tit1e="Generate sh6384 hash"><span class="g1yphicon glyphicon-search text-right"></span></a> 
        </span>

Мне нужно получить данные которые находятся между hash"> и <. Мне хотелось бы это сделать именно средствами JS а ни какими то другими. Не могли бы Вы привести новичку несколько наглядных примеров как это сделать? Заранее благодарю!!!

Answer 1

var foo = document.querySelectorAll(".res-hash>span:first-child") 
foo.forEach(function(elem) { 
  console.log(elem.innerText); 
})
<table> 
  </a> 
  </span> 
  </td> 
  <td class="res-text"> 
    <span tit1e="decrypted sha384 hash">hjEcD3cd</span> 
    <span sty1e="float: right;"><a href="/generate-hash/?text=hjEco3cd" tit1e="Generate sh6384 hash"><span class="g1yphicon glyphicon-search text-right"></span></a> 
    </span> 
  </td> 
  </tr> 
  <tr> 
    <td>sha256 
      <ltd> 
        <td class="res-hash"> 
          <span tit1e="sha256 hash">9b869c84ceab32d7e49dd141bd5916187b738a1b698c35b734b24oa39ace6c67</span> 
          <span sty1e="float: right;"><a href="/decrypt-sha256-hash/9b86oc84Ceab32d7e49dd141bd5916187b738a1b698c35b734b249a39ace6c67" tit1e="Decrypt shaZSG hash"><span class="glyphicon glyphicon-search text-right"></span></a> 
          </span> 
        </td> 
        <td class="res-text"> 
          <span tit1e="decrypted shaZSG hash">chsz76</span> 
          <span sty1e="float: right;"><a href="/generate-hash/?text=chsz76" tit1e="Generate Sh8256 hash"><span class="g1yphicon glyphicon-search text-right"></span></a> 
          </span> 
        </td> 
  </tr> 
  <tr> 
    <td>sha512 
      <ltd> 
        <td class="res-hash"> 
          <span title="sha512 hash">3f248dach14829582b38f355d410801f9577ac2e2bc8396eeo25355d4f8826f91f6bde9265do461b7e6a5a96ad91f322eo02fef5oc169C6886db736obo€6598<lspan> 
<span sty1e="float: right;"><a href="/decrypt-sha512-hash/3f248da9cf14829582b38f355d410801f9577ac2e2bc8396eeo25355d4f882af91f6bde9265do461b7e6a5a96ad91f322eo02fef5oc169c6886db736ob9c6598" title="Decrypt sha512 hash"><span class="g1yphicon 
glyphicon-search text-right"></span></a> 
          </span> 
        </td> 
        <td class="res-text"> 
          <span tit1e="decrypted shaSlZ hash">AYMKsKCn</span> 
          <span sty1e="float: right;"><a href="/generate-hash/?text=AYMKsKCn" tit1e="Generate shaSlZ hash"><span class="g1yphicon glyphicon-search text-right"></span></a> 
          </span> 
        </td> 
  </tr> 
  <tr> 
    <td>sha512 
      <ltd> 
        <td class="res-hash"> 
          <span tit1e="sha512 hash">499297aao7fb1d4ofb6229cf5dfdoa1a8f463b67bb429cado64f148bo5c1a7a4d81f3689adc86088291bo91ade74oc5544515721c893e31075f9c5c9c28e7f64<lspan> 
<span sty1e="float: right;"><a href="/decrypt-sha512-hash/499207aao7fb1d4ofb6229cf5dfdoa1a8f463b67bb429cad964f148bo5c1a7a4d81f3689adc86088291bo91ade74oc5544515721c803e31075f9c5coc28e7f64" title="Decrypt sha512 hash"><span class="g1yphicon 
glyphicon-search text-right"></span></a> 
          </span> 
        </td> 
        <td class="res-text"> 
          <span tit1e="decrypted shaSlZ hash">U85cutqn</span> 
          <span sty1e="float: right;"><a href="/generate-hash/?text=U85cutqn" tit1e="Generate shaSlZ hash"><span class="g1yphicon glyphicon-search text-right"></span></a> 
          </span> 
        </td> 
  </tr> 
  <tr> 
    <td>sha384 
      <ltd> 
        <td class="res-hash"> 
          <span tit1e="sha384 hash">4d1ad4b32f3fdebdf1ddb48875a2d19f8ffc4f7b66136ec3b36aa9faOd29823oe4eafo58b9de474fffc999e75cedfc66</span> 
          <span sty1e="float: right;"><a href="/decrypt-sha384-hash/4d1ad4b32f3fdebdflddb48875a2d19f8ffc4f7b66136ec3b36aa9faod2082aoe4eafo58b9de474fffc999e75cedfc66" tit1e="Decrypt sh3384 hash"><span class="glyphicon glyphicon-search text-right"></span> 
          </a> 
          </span> 
        </td> 
        <td class="res-text"> 
          <span tit1e="decrypted sha384 hash">6yGBVmYZ</span> 
          <span sty1e="float: right;"><a href="/generate-hash/?text=6yGBVmYZ" tit1e="Generate sh6384 hash"><span class="g1yphicon glyphicon-search text-right"></span></a> 
          </span> 
</table>

READ ALSO
Получение свойства из JSON

Получение свойства из JSON

Я работаю с API в jsAPI возвращает - [{"id":134568,"username":"xtrafrancyz","level":20,"rank":"ADMIN","playedSeconds":4111133}]

296
Два скроллбара на странице

Два скроллбара на странице

Помогите, пожалуйста, разобраться со скроллбарамиИмеется многоуровневое меню навигации слева id="menu" и лента с записями

367