开发者

jQuery Code is working on Google Chrome but not Firefox,IE and even Safari

I wrote this code and it is working nicely in Google Chrome but when it comes to Firefox and other major browsers, it is not even changing a little bit thing :

jQuery("div[style*='line-height:25px']").contents(":not(nodeType!='1',br)").wrap("<div style='margin-bottom:9px;line-height:normal;margin-top:4px'&开发者_JAVA技巧gt;");
jQuery("div[style*='line-height:25px'] br").remove();

It may look a bit weird but it is the thing I want to solve a really frustrating problem, so anyways let me give you the specifications about the system :

  • jQuery 1.3.2 with noConflict() method to avoid conflicts with prototype $
  • Scriptaculous 1.7.1_beta3
  • Prototype 1.5.1
  • And yeah I am using jQuery(document).ready() function to do things after DOM is ready.

Those are the libraries also embedded on the page.

For Recommendations: I didn't develop this page and other hundred of pages like this one and the problem is they are all static pages and using shtml to at least share some common code. But I can't remove any of those libraries because it means I will have to edit a lot of pages and it will cost me weeks. So actually what I am looking is temporary solutions like the one above.

Thanks in advance.

Partial 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>


How about rewriting them slightly?

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';
}


I don't think your contents selector is setup correctly. You should do something like:

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();


Dont use ' in the selector, just:

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


yikes. jquery lets you write some very powerful queries, but it doesnt mean that you should.

if you have control over the html you should add some classes where needed and replace that mess with some class selectors, it will work in all browsers and be faster to boot

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜