JavaScript 中 this 的等价物是什么？ [关闭]答案

【问题标题】：What is the equivalent of this in JavaScript? [closed]JavaScript 中 this 的等价物是什么？ [关闭]
【发布时间】：2016-07-04 04:08:32
【问题描述】：

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

r 是来自 AJAX 调用的响应 r 是网页响应。

我想用 JavaScript 编写上面的代码，而不是使用任何 jQuery，因为 node.js 不允许我这样做。

我试过document.getElementsByClassName("BuyPriceBox")，但我不知道如何做.find等效并获取数据。

编辑、更新

这是我尝试过的

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

正确吗？因为我刚刚收到一个错误：'TypeError: Cannot read property 'toLowerCase' of undefined'

这就是我在顶部所拥有的。

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

我也收到这样的请求。

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

另外，如何安装模块？

【问题讨论】：

r是ajax请求返回的数据。
仅供参考，但find() 返回一个 jQuery 对象，因此无需再次包装它：$(r).find(".BuyPriceBox .PurchaseButton").data()
感谢@roryMcCrossan 我想知道为什么我在向下移动元素时总是必须写 .find() 但这让我意识到 XD
ajax 调用可以有多种响应类型。所以这个问题不清楚。
getElementsByClassName 返回一个数组，您可以访问该数组的第一个索引，然后从 dom 中的该位置执行另一个 getElementsByClassName ...或者您可以按照答案中的建议使用 querySelector做同样的事情。然后你需要使用dataset 来获取数据。也许您可以解释您不理解或不起作用的地方，而不是愚蠢地调用提供的解决方案....

标签： javascript jquery node.js

【解决方案1】：

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

应该大致翻译成

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

其中r 的类型为object（节点）。

【讨论】：

r 不是节点。它必须是一个 htmlString，因为 OP 说它是作为响应来的。
@ChristopherAlastair 如果这是一个愚蠢的东西，那你为什么要发布一个愚蠢的问题？
@ChristopherAlastair 你能在问题中包含r 的值吗？
如果$(r).find(".BuyPriceBox") 工作正常，那么我相信这是某个节点和@ChristopherAlastair，您的问题是如何将那个愚蠢的代码转换为vanila JavaScript。
如果 $(r) 产生具有 .find() 方法的东西，r 可能是 html 元素名称或选择器。或者包裹在 responseText 周围的 $() 是否可以访问非元素中的 .find() ？这很重要，因为如果 $(r) 产生一个节点，答案就是 .querySelector。如果 $(r) 是字符串或其他内容，则需要使用 .search() 或正则表达式。

【解决方案2】：

假设变量 r 是一个 HTML 字符串或一个 HTML 元素，您必须执行以下函数：

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;
}

您可以将代码重写为：

var data = [];

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

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

【讨论】：