解析当前页面的网页提交按钮

Web page submit button that parses current page

本文关键字：网页 提交 按钮 当前页      更新时间：2023-09-26

来自以下网页代码：

（现在不要通读它 - 只需跳过它并查看我需要从以下代码中获取的内容，然后您就可以回到这段代码。

<table class="shop_table cart" cellspacing="0">
  <thead>
    <tr>
      <th class="product-remove">&nbsp;</th>
      <th class="product-thumbnail">&nbsp;</th>
      <th class="product-name">Product</th>
      <th class="product-price">Price</th>
      <th class="product-quantity">Quantity</th>
      <th class="product-subtotal">Total</th>
    </tr>
  </thead>
  <tbody>
    <tr class="cart_item">
      <td class="product-remove">
        <a href="http://dev123.MyDomain.com/cart/?remove_item=02e74f10e0327ad868d138f2b4fdd6f0&#038;_wpnonce=2eef060511" class="remove" title="Remove this item">&times;</a>	
      </td>
      <td class="product-thumbnail">
        <a href="http://dev123.MyDomain.com/product/5-htp-power/">
          <img width="90" height="90" src="http://dev123.MyDomain.com/wp-content/uploads/2014/04/product/2806-90x90.jpg" class="attachment-shop_thumbnail wp-post-image" alt="2806" />
        </a>
      </td>
      <td class="product-name">
        <a href="http://dev123.MyDomain.com/product/5-htp-power/">5-HTP Power</a>	
      </td>
      <td class="product-price">
        <span class="amount">&#36;19.55</span>	
      </td>
      <td class="product-quantity">
        <div class="quantity">
          <input type="number" step="1" name="cart[02e74f10e0327ad868d138f2b4fdd6f0][qty]" value="35" title="Qty" class="input-text qty text" size="4" />
        </div>
      </td>
      <td class="product-subtotal">
        <span class="amount">&#36;97.75</span>	
      </td>
    </tr>
    <tr class="cart_item">
      <td class="product-remove">
        <a href="http://dev123.MyDomain.com/cart/?remove_item=6ea9ab1baa0efb9e19094440c317e21b&#038;_wpnonce=2eef060511" class="remove" title="Remove this item">&times;</a>	
      </td>
      <td class="product-thumbnail">
        <a href="http://dev123.MyDomain.com/product/5-w/">
          <img width="90" height="90" src="http://dev123.MyDomain.com/wp-content/uploads/2014/04/product/1120-90x90.jpg" class="attachment-shop_thumbnail wp-post-image" alt="1120" />
        </a>
      </td>
      <td class="product-name">
        <a href="http://dev123.MyDomain.com/product/5-w/">5-W</a>	
      </td>
      <td class="product-price">
        <span class="amount">&#36;19.35</span>	
      </td>
      <td class="product-quantity">
        <div class="quantity">
          <input type="number" step="1" name="cart[6ea9ab1baa0efb9e19094440c317e21b][qty]" value="104" title="Qty" class="input-text qty text" size="4" />
        </div>
      </td>
      <td class="product-subtotal">
        <span class="amount">&#36;77.40</span>	
      </td>
    </tr>
    <tr class="cart_item">
      <td class="product-remove">
        <a href="http://dev123.MyDomain.com/cart/?remove_item=c16a5320fa475530d9583c34fd356ef5&#038;_wpnonce=2eef060511" class="remove" title="Remove this item">&times;</a>	
      </td>
      <td class="product-thumbnail">
        <a href="http://dev123.MyDomain.com/product/7-keto/">
          <img width="90" height="90" src="http://dev123.MyDomain.com/wp-content/uploads/2014/04/product/2922-90x90.jpg" class="attachment-shop_thumbnail wp-post-image" alt="2922" />
        </a>
      </td>
      <td class="product-name">
        <a href="http://dev123.MyDomain.com/product/7-keto/">7-Keto</a>	
      </td>
      <td class="product-price">
        <span class="amount">&#36;38.25</span>	
      </td>
      <td class="product-quantity">
        <div class="quantity">
          <input type="number" step="1" name="cart[c16a5320fa475530d9583c34fd356ef5][qty]" value="3" title="Qty" class="input-text qty text" size="4" />
        </div>
      </td>
      <td class="product-subtotal">
        <span class="amount">&#36;114.75</span>	
      </td>
    </tr>
    <tr class="cart_item">
      <td class="product-remove">
        <a href="http://dev123.MyDomain.com/cart/?remove_item=182be0c5cdcd5072bb1864cdee4d3d6e&#038;_wpnonce=2eef060511" class="remove" title="Remove this item">&times;</a>	
      </td>
      <td class="product-thumbnail">
        <a href="http://dev123.MyDomain.com/product/acidophilus/">
          <img width="90" height="90" src="http://dev123.MyDomain.com/wp-content/uploads/2014/04/product/1666-90x90.jpg" class="attachment-shop_thumbnail wp-post-image" alt="1666" />
        </a>
      </td>
      <td class="product-name">
        <a href="http://dev123.MyDomain.com/product/acidophilus/">Acidophilus</a>	
      </td>
      <td class="product-price">
        <span class="amount">&#36;15.95</span>	
      </td>
      <td class="product-quantity">
        <div class="quantity">
          <input type="number" step="1" name="cart[182be0c5cdcd5072bb1864cdee4d3d6e][qty]" value="22" title="Qty" class="input-text qty text" size="4" />
        </div>
      </td>
      <td class="product-subtotal">
        <span class="amount">&#36;31.90</span>	
      </td>
    </tr>
    <tr>
      <td colspan="6" class="actions">
        <div class="coupon">
          <label for="coupon_code">Coupon:</label>
          <input type="text" name="coupon_code" class="input-text" id="coupon_code" value="" placeholder="Coupon code" />
          <input type="submit" class="button" name="apply_coupon" value="Apply Coupon" />
        </div>

我需要抓住以下项目：

alt="2806" 的 2806 部分

值="35"

的 35 部分标题="数量"

alt="1120" 的 1120 部分

值="104"

的 104 部分标题="数量"

alt="2922" 的 2922 部分

值="3

"的 3 部分标题="数量"

alt="1666" 的 1666 部分

值="22"

的 22 部分标题="数量"

我看过这个页面：

Javascript：如何遍历页面上的所有 DOM 元素？

和这个页面：

http://www.w3schools.com/js/js_htmldom_nodelist.asp

我有点头晕目眩。

我需要的是一些 JavaScript 代码，这将导致......包含以下内容的变量：

<input type="hidden" name="prodnum" value="2806" />
<input type="hidden" name="prodqty" value="35" />
<input type="hidden" name="prodnum" value="1120" />
<input type="hidden" name="prodqty" value="104" />
<input type="hidden" name="prodnum" value="2922" />
<input type="hidden" name="prodqty" value="3" />
<input type="hidden" name="prodnum" value="1666" />
<input type="hidden" name="prodqty" value="22" />

我

将继续为此而挣扎，看看我是否能自己弄清楚，但可能性对我不利。

感谢您提供的任何帮助！

你可以使用三维 JavaScript 对象来做到这一点：

jsFiddle 演示

var stObj = {};
$('#mybutt').click(function(){
    var cnt = 0;
    $('.shop_table tbody tr:not(:last-child)').each(function(){
        //alert( this.className );
        cnt++;
        stObj[cnt] = {};
        $this = $(this);
        var thImg = $this.find('.product-thumbnail a img').attr('alt');
        //alert(thImg);
        var prQty = $this.find('.product-quantity div input').val();
        //alert(prQty);
        stObj[cnt]['thImg'] = thImg;
        stObj[cnt]['prQty'] = prQty;
    });
    alert( JSON.stringify(stObj) );
});

笔记：

（1） 对象stObj是全局定义的（即在使用它的功能之外 - 上面）

（2） jQuery 选择器tr:not(:last-child)防止尝试在最后一个表行中查找alt和value

（3） 在 jsFiddle 中，#tstdiv 立即被代码隐藏。如果可见，它只是显示代码已损坏，而无需按下任何按钮。

引用：

JavaScript 中的多维关联数组

javascript 或 jquery：循环多维对象

相关文章：