【问题标题】:Get information from external website using pure javascript使用纯 javascript 从外部网站获取信息
【发布时间】:2021-06-28 15:59:18
【问题描述】:

我找到了一个简单的 jQuery sn-p,它可以从外部网站提取信息。但是,我正在努力将其转换为纯粹在 JavaScript 上运行。我认为我走在正确的道路上,但我不确定如何过滤提取的信息并仅显示 h1 标签内的文本。如果有人可以提供帮助或提示我下一步应该做什么,我将不胜感激。提前谢谢!

这是功能齐全的 jQuery 代码:

$.ajax({
    url:'https://enable-cors.org',
        type:'GET',
        success: function(data){
           $('#content').html($(data).find('h1').html());        
        }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="content"></div>

这是我目前拥有的 JavaScript:

let request = new XMLHttpRequest();
request.open("GET", "https://enable-cors.org", true);
request.onload = () => {console.log(request.responseText)}
request.send();

【问题讨论】:

  • 看看使用更现代的fetch() 而不是XMLHttpRequest
  • 非常感谢您的推荐,由于我对这个功能不熟悉,所以我需要进一步研究。

标签: javascript html jquery xmlhttprequest


【解决方案1】:

你需要

(1) 将响应转换为您可以浏览的文档,以便您可以访问&lt;h1&gt;

(2) 用找到的&lt;h1&gt; 中的内容填充#content

let request = new XMLHttpRequest();
request.open("GET", "https://enable-cors.org", true);
request.onload = () => {
  const doc = new DOMParser().parseFromString(request.responseText, 'text/html');
  document.querySelector('#content').innerHTML = doc.querySelector('h1').innerHTML;
}
request.send();
&lt;div id="content"&gt;&lt;/div&gt;

【讨论】:

  • 非常感谢您提供的解决方案。它就像一个魅力。我必须进一步研究“DOMParser”,因为这对我来说是全新的。再次感谢您!
猜你喜欢
  • 2012-07-05
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多