0

我的目标是从网页中获取特定的文本区域。想象一下，如果您能够在页面上的任何位置绘制一个矩形，并且该矩形中的所有内容都将被复制到您的剪贴板中。我正在使用 FireBug（请随意提出其他解决方案，我已经搜索了插件或书签，但没有找到任何有用的东西），它的控制台窗口和 XPath 用于此目的。我想要获取的值采用以下格式（这是从 FireBug“HTML 检查”中观察到的）：

<span class="number3_0" title="Numbers">3.00</span>

所以我最终得到以下代码，我从 FireBug 控制台发出： $x("//span[@title='Numbers']/text()")

在此之后我得到这样的东西：

[<TextNode textContent="2.00">, <TextNode textContent="2.00">, <TextNode textContent="2.00">, <TextNode textContent="2.00">, <TextNode textContent="3.00">]

在此之后，我单击（用鼠标右键）[并选择，Inspect in DOM panel然后按ctrl+a以下格式复制/粘贴数据：

0   <TextNode textContent="2.00">
1   <TextNode textContent="2.00">
2   <TextNode textContent="2.00">
3   <TextNode textContent="2.00">
4   <TextNode textContent="3.00">

正如您可以假设的值textContent是我感兴趣的信息。我尝试修改原始 XPath 查询以仅返回这些数字但没有运气。我曾是：

string()按照此处的建议将整个查询包装到Xpath - 仅获取节点内容而不获取其他元素

试图弄清楚这个是如何工作的，通过 XPath 等方法在节点之间提取文本。

为了能够获得所需的值，我使用了一些 bash-scripting + xml-formatting，在完成这个乏味/容易出错的任务之后，我得到了以下格式：

<?xml version="1.0"?>
<head>
  <TextNode textContent="2.00"/>
  <TextNode textContent="2.00"/>
  <TextNode textContent="2.00"/>
  <TextNode textContent="2.00"/>
  <TextNode textContent="3.00"/>
  <TextNode textContent="3.00"/>
</head>

现在我用xmlstarlet以下方式获取这些值（是的，我知道我可以在上一步中使用正则表达式并拥有我需要的所有数据。但我对 DOM/XPath 解析很感兴趣，并试图弄清楚它是如何工作的）：

cat input | xmlstarlet sel -t -m "//TextNode" -v 'concat(@textContent," 
")'

这最终给了我想要的输出：

2.00
2.00
2.00
2.00
3.00

我的问题有点笼统：

  1. 这个可怕的漫长过程如何自动化？
  2. 如何修改 FireBug 中使用的原始 XPath 字符串 $x("//span[@title='Numbers']/text()")以立即仅获取数字并节省自己的其余步骤？

  3. 我还不是很熟悉xmlstarlet，尤其是选择（sel）模式让我抓狂。我见过以下选项的各种组合：

    -c 或 --copy-of - 打印 XPATH 表达式的副本

    -v 或 --value-of - 打印 XPATH 表达式的值

    -o 或 --output - 输出字符串文字

    -m 或 --match - 匹配 XPATH 表达式

有人可以解释一下什么时候使用哪个吗？如果可能的话，很高兴看到具体的例子。如果感兴趣，有提到的选项的各种组合，我不太了解： http ://www.grahl.ch/blog/minutiae-return-content-element-xmlstarlet 使用 xmlstarlet 提取和转储元素 测试 XML属性

4.）关于最后一个问题xmlstarlet是一个装饰性的语法糖，如何获得漂亮的换行符分隔输出，正如你所看到的，我通过添加换行符作为分隔符“作弊”，但是当我尝试使用这样的转义字符时：

cat input | xmlstarlet sel -t -m "//TextNode" -v 'concat(@textContent,"\n")'

它没有用，我从中学到很多东西的原始参考也以这种“丑陋”的方式使用它http://www.ibm.com/developerworks/library/x-starlet/index.html

PS：也许这些所有步骤都可以使用 curl + xmlstarlet 来简化，但是对于需要登录或其他类似内容的页面也可以使用 FireBug 选项。

感谢所有的想法。

4

2 回答 2

2

根据我收集的信息，您想从标题为“数字”的跨度中收集数字并将其作为字符串。

尝试以下操作：

var numberNodes = document.querySelectorAll('span[title="Numbers"]')
function giveText(me) { return me.textContent; }
Array.prototype.map.call(numberNodes, giveText).join("\n");

第一行使用文档中的 CSS 查询选择器选择所有节点（这意味着您不需要 XPath）。第二行创建一个返回节点文本内容的函数。第三行numberNodes使用giveText函数映射列表中的元素，生成一个数字数组，最后用换行符将它们连接起来。

在此之后，您可能不需要此 xmlstarlet。

于 2013-10-21T23:24:49.647 回答
1

$$("<CSS3 selector>")并且$x("<XPATH>")在 Firebug 中实际上返回一个真正的数组（不像 document.querySelectorAll() 或 document.evaluate 的结果）。所以他们更方便。

使用 Firefox + Firebug：

var numbersNode = $x("//span[@title='Numbers']/text()");
var numbersText = numbersNode.map(function(numberNode) {
    return numberNode.textContent;
}).join("\n");
// Special command of Firebug to copy text into clipboard:
copy(numbersText);

您甚至可以使用 EcmaScript 6 的箭头函数以一种紧凑的方式进行操作：

copy($x("//span[@title='Numbers']/text()").map(x => x.textContent).join("\n"));

如果您$$('span[title="Numbers"]')按照威廉纳蒙塔斯的建议选择，则相同。

弗洛朗

于 2013-10-22T12:05:26.907 回答