Question

概述

我非常感谢任何帮助。我确信这很“容易”，但我无法弄明白。我不得不使用选择器来选择唯一的图像文件名。然后，我需要替换<td>所在的<td>右侧一列的<img>。

我有当前的网站，我也制作了一个图表，以帮助更好地解释这一点。检查以下两个链接：网站：http://www.writeguard.com/catalog/Checks/LaserInkjet-Checks 图：http://goo.gl/Q3Uif

问题

上述网站的链接没有问题。我们在oscommerce中进行了“特许经营”定制修改。只有拥有特定帐户的客户才能登录我需要帮助的地方。我做的图表就足够了。只是这样你就拥有了我的“谜题”的所有“部分”，这就是我如何为主要网站做.replaceWIth()。这个例子是针对顶行...我需要修改每一行的其中一行。

 $("a[href$=/Premium-Security-Laser-Check].smallTextLink").parent()
 .replaceWith('<td class="productListing-data" style="border-left:1px solid #FFF; border-top:1px solid #FFF; border-bottom:1px solid #808080; border-right:1px solid #808080;"><div class="leftSide"><a href="http://www.writeguard.com/catalog/Checks/LaserInkjet-Checks/Premium-Security-Laser-Check" class="smallTextLink">Premium Security Laser Check</a><ul style="line-height: 1.5em; font-size: 11px; margin-left: -15px;"><li style="color:red;"><strong>Buy 500 Checks, Get 500 Free Special!</strong></li><li>More than 8 security features</li><li>Thermochromic Ink</li><li>8.5" x 11" sheet 24lb MICR paper</li><li>2 perforations @ 3.5" x 7"</li></ul><div class="moreInfoButtonsNew"><a href="http://www.writeguard.com/catalog/Checks/LaserInkjet-Checks/Premium-Security-Laser-Check" class="positive"><img src="http://writeguard.com/catalog/images/new_layout/icons/information.png" alt=""/>More Info</a></div></div><div class="rightSide"><p class="ourPrice">Starting At:<br>$39.50</p></div></td>');

我认为这根本不高效。但就我现在所遇到的这个问题而言，我需要能够做到我在顶部描述的内容。通过它的文件名选择<img>，然后导航DOM，这样我就可以使用.replaceWith()来实现我上面描述的相同内容。我尝试了很多不同的选择器，但没有一个能够工作。它总是最终在表数据内的表数据中创建表数据，直到页面长度为10英尺。我不知道我哪里出错了。

如有必要，我很乐意提供更多细节。我显然对jQuery没有很多经验，我的方法可能是一场噩梦。我想尽快学习使用jquery编程的正确，有效的方法。非常感谢你的帮助！

Answer 1

我认为问题在于您的选择器。

我不相信$("a[href$=/Premium-Security-Laser-Check].smallTextLink")会抓住任何东西。

试试这个：

$('a.smallTextLink[href$="Premium-Security-Laser-Check"]').click(function()
{
    alert('clicked the security laster check small text link');
});

如果可行，那么您应该只需更换选择器并让替换工作。

$('a.smallTextLink[href=/Premium-Security-Laser-Check]').parent() .replaceWith('<td class="productListing-data" style="border-left:1px solid #FFF; border-top:1px solid #FFF; border-bottom:1px solid #808080; border-right:1px solid #808080;"><div class="leftSide"><a href="http://www.writeguard.com/catalog/Checks/LaserInkjet-Checks/Premium-Security-Laser-Check" class="smallTextLink">Premium Security Laser Check</a><ul style="line-height: 1.5em; font-size: 11px; margin-left: -15px;"><li style="color:red;"><strong>Buy 500 Checks, Get 500 Free Special!</strong></li><li>More than 8 security features</li><li>Thermochromic Ink</li><li>8.5" x 11" sheet 24lb MICR paper</li><li>2 perforations @ 3.5" x 7"</li></ul><div class="moreInfoButtonsNew"><a href="http://www.writeguard.com/catalog/Checks/LaserInkjet-Checks/Premium-Security-Laser-Check" class="positive"><img src="http://writeguard.com/catalog/images/new_layout/icons/information.png" alt=""/>More Info</a></div></div><div class="rightSide"><p class="ourPrice">Starting At:<br>$39.50</p></div></td>');

Answer 2

选择器应为：

$('a.smallTextLink[href$="Premium-Security-Laser-Check"]')

你桌子的结构，你有：

<tr>
  <td>
    <div>
      <a href='....'>
      ..
      ..

所以你的jQuery语句需要找到一个td的父类。 parent（）返回div。你希望父母（'td：first'）抓住第一个作为td元素的父母。

$('a[href$="Premium-Security-Laser-Check"].smallTextLink').parents('td:first')
  .replaceWith(....)

我无法将DOM从<img/>遍历到......？

概述

问题

2 个答案: