Taking HTML content from other URL pages with JavaScript

Question

I want my app to take text from other web pages!

If I insert the word "computer" I want to go to the URL of Cambridge's website and to take data I need.

insertingNewWord(insertedWord){
    var pageHTML = "https://dictionary.cambridge.org/dictionary/english/"+insertedWord;
    var definition = pageHTML.getElementByClasName("def-head");

    return definition;
}

Any idea how I could take any tag by Class or ID name from another page, and printed in my app. If I get a solution in ReactJs that would be even better.

If you're doing this in node and are open to using a package, this is a popular one that works the same as jquery. https://www.npmjs.com/package/cheerio — stever, Feb 02 '19 at 17:19
Read this about get requests here: https://stackoverflow.com/questions/247483/http-get-request-in-javascript — Per Digesen, Feb 02 '19 at 17:20
You have to use API for this purpose https://dictionary-api.cambridge.org/api/demo — Googlian, Feb 02 '19 at 17:24

score 1 · Answer 1 · answered Feb 02 '19 at 17:33

One option is to use an <iframe>

<input type="text"><input type="button" value="search dictionary"><br>
<iframe width="400" height="300"></iframe>
<script>
  const [input, button] = document.querySelectorAll('input');
  const iframe = document.querySelector('iframe');
  button.addEventListener('click', e => {
    iframe.src = "https://dictionary.cambridge.org/dictionary/english/" + input.value;
  })
</script>

Taking HTML content from other URL pages with JavaScript

1 Answers1