What is the equivalent of this in JavaScript?

Question

var stuff = $($(r).find(".BuyPriceBox")).find(".PurchaseButton").data();

r is the response from the AJAX call r is the web page response.

I want to write the above code in JavaScript, not using any jQuery, as node.js doesn't allow me to.

I tried document.getElementsByClassName("BuyPriceBox") but I dont know how to do .find equivalent and get the data.

---

Edit, Updated

Here is what i tried

var parser = new DOMParser(); 
var doc = parser.parseFromString(r, "text/html");    
console.log(JSON.stringify(query(doc, ".BuyPriceBox .PurchaseButton").dataset))

Is that correct? because i just got an error : 'TypeError: Cannot read property 'toLowerCase' of undefined'

This is what i have at the top.

var request = require("request"); 
var DOMParser = require("xmldom").DOMParser; var query = require("queryselector"); 

also im getting the request like this.

request({ url: "roblox.com/A-Lucky-Presence-item?id=380201576";, method: 'GET' }, function(err, res, r) {

Also, how do i install the modules?

Answer 1

$($(r).find(".BuyPriceBox")).find(".PurchaseButton").data();

Should roughly translate to

r.querySelector(".BuyPriceBox .PurchaseButton").dataset

where r is of type object (node).

Answer 2

Assuming that the variable r is an HTML string or an HTML element and you would have to following functions:

function parseHTML(htmlString) {

    if (htmlString instanceof HTMLElement) {
        return htmlString;
    }

    var el = document.createElement('html');
    el.innerHTML = htmlString;
    return el;
}
function toArray(htmlCollection) {
    return [].slice.call(htmlCollection);
}

function findIn(className, parent) {

    var elements = toArray(document.getElementsByClassName(className));

    return elements.filter(function (element) {
        isDescendantOf(element, parent);
    });
}

function isDescendantOf(element, parent) {
    while (element = element.parentElement) { 
        if (element === parent) {
            return true;
        }
    }

    return false;
}

You could rewrite you code to:

var data = [];

findIn('.BuyPriceBox', r).forEach(function (element) {

    data.concat(findIn('.PurchaseButton', element).map(function (element) {
        return element.dataset;
    }));
});