3

HTML 代码：

<td>
<img src="../images/items/333.png"><br>
<b>Product One</b><br>
(2 in stock)<br>
<i>65 USD</i><br>
<form action="shopping.php?shop=1&amp;item=333&amp;price=65&amp;buy=conf&amp;type=" method="post">
<input name="" value="Buy this item" type="submit">
</form></td>

<td>
<img src="../images/items/444.png"><br>
<b>Product Two</b><br>
(4 in stock)<br>
<i>5 USD</i><br>
<form action="shopping.php?shop=1&amp;item=444&amp;price=5&amp;buy=conf&amp;type=" method="post">
<input name="" value="Buy" type="submit">
</form></td>

这是我正在处理的页面上的 html 代码，无法更改 html 代码。
页面上有几个 td 标记，其中包含您在上面的代码中看到的以下信息。



我想写一个脚本来做这样的事情：

if (document.body.innerHTML.indexOf("Product One") > -1) {
document.location = "shopping.php?shop=1&amp;item="+itemID+"&amp;price="+USD+"&amp;buy=conf&amp;type="
}

在页面的 body/td 中搜索我的脚本中指定的“产品名称”，如果找到，则转到包含需要提取的变量 itemID 和 USD 的 url。

itemID通过取数字从 image.png 的 src 中提取。例如，itemID../images/items/444.png为 444。

美元是从斜体标签之间定义的价格中提取的。例如，提取的美元值为<i>5 USD</i>5。



捕获是

我需要很多来if (document.body.innerHTML.indexOf("Name") > -1) {document.location = "shopping.php?shop=1&amp;item="+itemID+"&amp;price="+USD+"&amp;buy=conf&amp;type="}迎合我指定的大量产品。我可能想指定“产品一到一百”和“子产品 A 到 Z”



解决方案

我想到的一些处理方法（需要放入javascript代码）是：

  1. 将我将指定的产品列表放入一个数组（类似的东西）var list = new Array ("Product One","Product Two","Sub-Product A");，并让一个函数检查页面是否存在来自该数组的任何产品，该数组显示在页面上。
  2. 找到商品后，要获取itemID，将商品的图片src中.png前后的数字分离出来。/items/而要获取美元，则获取<i> </i>标签之间的值，并且只取数值
  3. 为此，我认为nextSibling或previousSibing可以使用，但我对此不太确定。
  4. 或者，为了更容易，可以有一个函数来立即定位表单的操作值并设置window.location因为<form action="shopping.php?shop=1&amp;item=444&amp;price=5&amp;buy=conf&amp;type=" method="post">
  5. 我在使用 XPath 之前已经看到过这个？
4

2 回答 2

2

使用 jQuery 并不难——特别是如果我们将它扩展为搜索不区分大小写的正则表达式。

以下脚本应该与问题中的 HTML 结构一起使用，如果它是精确准确的并且不是由 AJAX 添加的。请注意正则表达式在针对产品描述时提供的功能。

您可以在 jsFiddle 查看底层代码。

// ==UserScript==
// @name     _Auto-follow targeted product links.
// @include  http://YOUR_SERVER.COM/YOUR_PATH/*
// @require  http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// ==/UserScript==

var targetList  = [
    "Shoes, pumps",
    "Horse shoes",
    "(?:Red|Pink|Burgundy)\\s+shoes?"
];

/*--- Extend jQuery with a case-insensitive version of contains().
    Also allows regular expressions.
*/
jQuery.extend (
    jQuery.expr[':'].containsCI = function (a, i, m) {
        //--- The next is faster than jQuery(a).text()...
        var sText   = (a.textContent || a.innerText || "");     

        var zRegExp = new RegExp (m[3], 'i');

        return zRegExp.test (sText);
    }
);

$.each (targetList, function (index, value) { 
    var jqSelector          = 'td > b:containsCI("' + value + '")';
    var productFound        = $(jqSelector);
    if (productFound.length) {
        var matchingForm    = productFound.first ().nextAll ("form");
        if (matchingForm.length) {
            alert (productFound.text () );
            document.location   = matchingForm.attr ("action");
        }
    }
} );
于 2012-06-11T09:54:06.260 回答
1

这是一个不依赖外部库（如 jQuery）的解决方案：

function findProducts(referenceList) {  
  var productsOnPage = {}, listMatches = {},
      tds = document.getElementsByTagName("TD"),
      bold, form, i, productName, productUrl;

  // build an index of products on the page (HTML scraping)
  for (i = 0; i < tds.length; i++) {
    bold = tds[i].getElementsByTagName("B")[0];
    form = tds[i].getElementsByTagName("FORM")[0];

    if (bold && form) {
      productName = bold.innerHTML.toLowerCase();
      productUrl  = form.action;

      productsOnPage[productName] = productUrl;
    }
  }

  // match reference list against all available products on the page
  for (i = 0; i < referenceList.length; i++) {
    productName = referenceList[i].toLowerCase();
    productUrl  = productsOnPage[productName];

    listMatches[productName] = productUrl;
  }

  return listMatches;
}

叫它：

var availableProducts = findProducts(["Product One","Product Two","Sub-Product A"]);

之后，您将拥有一个availableProducts如下所示的对象：

{
  "product one": "shopping.php?shop=1&item=333&price=65&buy=conf&type=",
  "product two": "shopping.php?shop=1&item=444&price=5&buy=conf&type=",
  "sub-product a": undefined
}

请注意，所有键都是小写的，以使字符串比较保持一致。查找您将使用的产品

function navigateIfAvailable(productName) {
  var url = availableProducts[productName.toLowerCase()];

  if (url) document.location = url;
}

现在

navigateIfAvailable("Product Two");

会去某个地方。或不。

于 2012-06-11T09:53:36.323 回答