Question

我编写了这段代码，它在谷歌浏览器中运行良好，但是当涉及到Firefox和其他主流浏览器时，它甚至没有改变一点：

jQuery("div[style*='line-height:25px']").contents(":not(nodeType!='1',br)").wrap("<div style='margin-bottom:9px;line-height:normal;margin-top:4px'>");
jQuery("div[style*='line-height:25px'] br").remove();

它可能看起来有点奇怪但是我想要解决一个非常令人沮丧的问题，所以无论如何让我给你关于系统的规格：

使用noConflict()方法的jQuery 1.3.2，以避免与原型$
Scriptaculous 1.7.1_beta3
原型1.5.1
是的，我在DOM准备就绪后使用jQuery(document).ready()函数来做事。

这些也是嵌入在页面上的库。

建议： 我没有开发这个页面和其他一百个像这样的页面，问题是它们都是静态页面并使用shtml至少共享一些公共代码。但我不能删除任何这些库，因为这意味着我将不得不编辑很多页面，这将花费我数周。所以实际上我正在寻找的是像上面那样的临时解决方案。

提前致谢。

部分HTML：

<div style="font-size: 13px; line-height: 25px;">
  <!-- BULLETS MORE -->
  <div style="line-height: normal;">
    Fine quality, full grain pebble leather
  </div>
   Smooth Classic Napa leather construction
  <br />
   Lateral footprint with top access
  <br />
   Durable belt clip
  <br />
   Top flap with snap closure for added security
  <br />
   Soft velvet lining with light protective layer
  <br />
   Bottom push-through cutout for easy Motorola Droid removal
  <br />
   Simple Scandinavian rounded design
  <br />
   Sena craftsmanship and quality
  <br />
</div>

Answer 1

如何稍微改写它们？

jQuery("div").filter(lineHeight).contents(nonElementNodes).wrap("<div style='margin-bottom:9px;line-height:normal;margin-top:4px'>");

jQuery("div").filter(lineHeight).find("br").remove();

function lineHeight() {
  return this.style.lineHeight == "25px";
}

function nonElementNodes() {
  return this.nodeType !== 1 || this.tagName !== 'BR';
}

Answer 2

我认为您的内容选择器设置不正确。你应该做点什么：

jQuery("div[style*='line-height:25px']").contents(":not(br)").filter(function(){return this.nodeType != 1;}).wrap("<div style='margin-bottom:9px;line-height:normal;margin-top:4px'>");
jQuery("div[style*='line-height:25px'] br").remove();

Answer 3

不要在选择器中使用'，只需：

jQuery("div[style*=line-height:25px]")

Answer 4

让人惊讶。 jquery允许你编写一些非常强大的查询，但它并不意味着你应该这样做。

如果您可以控制html，您应该在需要的地方添加一些类，并用一些类选择器替换它，它可以在所有浏览器中运行并且更快启动

jQuery Code正在开发谷歌Chrome，但不支持Firefox，IE甚至Safari

4 个答案: