How can I get a text from a div?

Viewed 75

I'm trying to get a piece of text that is inside a <div class> of a especific URL and return only the content inside the <a title>. Like "<div class="test"><a title="Hello World"></a></div>" and return Hello World.
But I don't know what should do to return pieces of the text, it's returning whole html.

const fetch = require("node-fetch");
fetch('https://www.google.com/')
    .then(function (response) {
        switch (response.status) {
            // status "OK"
            case 200:
                return response.text();
            // status "Not Found"
            case 404:
                throw response;
        }
    })
    .then(function (template) {
        console.log(template)
        console.log("DONE");
    })
    .catch(function (response) {
        // "Not Found"
        console.log(response.statusText);
    });
3 Answers

This should do it:

fetch('https://github.com/')
    .then(res => res.text())
    .then(body => console.log(body));

Taken from node-fetch documentation https://www.npmjs.com/package/node-fetch

Or if you want to specifically get the title tag, you may use:

 var titleTag = body.split('<title>')[1].split('</title>')[0];

if you want to manipulate string HTML, you have first convert it to HTML object (or parse the string). You can do it this way:

var htmlString = '<div class="test"><a title="Hello World"></a></div>';
var temp = document.createElement('div');
temp.innerHTML = htmlString;
var htmlObject = temp.firstChild;

console.log(htmlObject.getElementsByTagName("a")[0].getAttribute("title"))

//Get attribute from all elements by tag

var text = '<div class="test"><a title="Hello World"><a title="Hello Street"></a></a><a title="Hello City"></a></div>';

function getAttributeFromAllElementsByTag(htmlString, tag, attribute){
  var tempArray = [];
  var temp = document.createElement('div');
  temp.innerHTML = htmlString;
  var htmlObject = temp.firstChild;
  var arrayOfElements = htmlObject.getElementsByTagName(tag);
  for(var i = 0;i < arrayOfElements.length;i++){
    tempArray.push(arrayOfElements[i].getAttribute(attribute))
  }
  return tempArray
}

console.log(getAttributeFromAllElementsByTag(text, "a", "title"))

        

        fetch('https://www.myear.sg/test.php')
        .then(function (response) {
            switch (response.status) {
                // status "OK"
                case 200:
                    return response.text();
                // status "Not Found"
                case 404:
                    throw response;
            }
        })
        .then(function (template) {
            console.log(find_id_details (template))
           document.getElementById("abc").innerHTML = find_id_details (template)
        })
        .catch(function (response) {
            // "Not Found"
            console.log(response.statusText);
        });




        function find_id_details (input){
            var part1 = input.split('<div id="abcd">')[1];
            var part2 = part1.split('"></a>')[0];
            var part3 = part2.split('<a title="').pop()
            return part3
        }
   
<div id="abc"> after the processing , you will get the answer </div> 

You can check this answer :

your issue was : "But I don't know what should do to return pieces of the text, it's returning whole html."

lets assunme your html file is :

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Document</title>
</head>
<body>
   <div id="abcd"> <a title="Hello World"></a></div>
   <div > test 2 </div>
   <div > test 3 </div>
</body>
</html>

now you will get the whole html as your response . and you want to parse the HTMl text and want to get the tag title "Hello World":

I make a custom function to parse the input HTML. now I have no idea about your HTML file. please check the find_id_details() function .

in your code , at the place of console.log(template) , use console.log(find_id_details (template))

fetch('https://example.com/something')
    .then(function (response) {
        switch (response.status) {
            // status "OK"
            case 200:
                return response.text();
            // status "Not Found"
            case 404:
                throw response;
        }
    })
    .then(function (template) {
        console.log(find_id_details (template))
    })
    .catch(function (response) {
        // "Not Found"
        console.log(response.statusText);
    });




    function find_id_details (input){
        var part1 = input.split('<div id="abcd">')[1];
        var part2 = part1.split('"></a>')[0];
        var part3 = part2.split('<a title="').pop()
        return part3
    }
Related