如何从对象 <div class="gwt-Label">Some Data</div> 中提取数组数据？

Question

如何从对象

一些数据

中提取数组数据？

因为@BrockAdams 为从 DIV 对象中提取数据的一般问题提供了一个很好的答案和解决方案，仅由 class 名称（无 ID）描述，并且由于制作了网页100 多个 DIV 个对象，由相同的 class 名称描述，主要是 "gwt-Label"

我正在寻找一种解决方案，通过修改以下@BrockAdams 的代码，将控制台的输出从 100 多行限制到几行

waitForKeyElements (".gwt-Label", printNodeText);

function printNodeText (jNode) {
    console.log("gwt-Label value: ", jNode.text().trim());
}

由于我在控制台中读取的输出超过 100 行，但我只需要按数组索引选择的几行。

您知道如何操作 jNode 以先将输出保存到数组，然后仅重新读取选定的数组元素并将其发送到控制台吗？

我更喜欢这样的伪代码：

jNode.text().trim()[0]
jNode.text().trim()[5]

运行作为 Greasemonkey 或 Tampermonkey 中的脚本。

而且，我需要在脚本中设置动态@match URL 的数字查询字符串循环脚本。

Answer 1

好吧，如果你有很多 class gwt-Label 元素，假设它们是 AJAX 在不同的批次中，你可以用代码将它们放入一个数组中像这样：

var valArry     = [];
var ajxFinshTmr = 0;

waitForKeyElements (".gwt-Label", storeValue);

function storeValue (jNode) {
    valArry.push (jNode.text ().trim () );
    if (ajxFinshTmr)  clearTimeout (ajxFinshTmr);

    //-- Let all initial AJAX finish, so we know array is complete.
    ajxFinshTmr = setTimeout (printFinalArray, 200);
}

function printFinalArray () {
    console.log ("The final values are: ", valArry);
}

请注意，几乎肯定有更多 robust/efficient/sensible 替代方案，但我们需要看到更多真实页面和真正目标，才能设计这些替代方案。

预计到达时间：我看到您刚刚链接到该网站。现在详细描述你想做什么。可能性可能会很混乱。

Answer 2

我花了几天时间才理解这个问题

// ==UserScript==
// @name        Important test1
// @namespace   bbb

// @include     http://srv1.yogh.io/#mine:height:0

// @version     1

// ==/UserScript==
console.log("sdfasg");

window.setTimeout(function() {
  
  var HTMLCollection = document.getElementsByClassName("gwt-Label");
console.log(HTMLCollection);
var elements = HTMLCollection.length;
console.log(elements);
  element = HTMLCollection[6];
  console.log(element);
  text = element.innerHTML;
  console.log(text);
  textclass= text.innerHTML;
 // console.log(textclass);

console.log("15minutes");
}, 15000);


  
 var HTMLCollection = document.getElementsByClassName();
console.log(HTMLCollection);

@BrockAdams 很有帮助。由于上述站点在随机持续时间加载，因此 GM 脚本有一天工作正常，生成完整的 HTMLCollection 但另一次生成它为空，使 innerHTML 生成未定义的值。 “353 more ... ]” HTMLCollection link 在变量视图中打开，取得了巨大的成功，生成了我试图通过 XPath 完成的内容，生成了所有 [ 的索引（编号）列表=45=] objects 在我的 HTMLCollection 里，让我 select DIV object 的兴趣被知晓。

我仍在寻找 DOM 解析和序列化

提供的类似解决方案

  [https://w3c.github.io/DOM-Parsing/#][1]

为我工作，将自然数、索引附加到 HTML 文档的每个 DOM object，让我可以与 Firebug 生成的 XPath 并行使用它

例子

html/body/div[3]/div[3]/div/div[6]/div[2]/div/div/div

其次是

html1/body2/div[3]5or-higher/div[3]/div/div[6]/div[2]/div/div/div

只是序列化 HTML DOM object，将唯一索引附加到每个 object 让我通过 HTMLCollection[ index] 或更好 HTMLDOMCollection[index]

我确信这种方法已经被 HTML DOM 序列化器解析器所知并采用，但我不知道如何访问它。

谢谢大家

如何从对象 <div class="gwt-Label">Some Data</div> 中提取数组数据？

How do I extract array data from the object <div class="gwt-Label">Some Data</div>?

javascript

greasemonkey

tampermonkey