有问题：包含IE8

Question

我正在下面选择在jQuery选择：

$("div[id^=WebPartWPQ]:has(table.ms-sitedirresultssort) td:contains(' : ')").closest('div') 

换句话说：选择带有ID的DIV开始WebPartWPQ具有与ms-sitedirresultssort类表中，有一个td包含文字:。在这个问题的最后是由SharePoint呈现的HTML。

该选择器在Firefox 3.5下完美工作，但不在Internet Explorer 8下。我正在使用hide()函数进行测试。

我已经缩小到选择器的td:contains(' : ')部分。在Firebug Lite中运行$("td:contains(' : ')")会抛出一些功能列表，例如某些内容无效。所有其他选择器在FB Lite中都可以正常工作。

我试过使用jQuery 1.3.2和jQuery 1.4rc1没有成功。这是jQuery中的一个bug，如果有的话，是否有票（我找不到）？任何想法如何最好地解决这个问题？

HTML：

<div style="" helpmode="1" helplink="/_layouts/help.aspx" allowdelete="false" class="ms-WPBody" 
    width="100%" id="WebPartWPQ4" haspers="false" webpartid="2ae67b12-82db-4238-8be9-cd4b39cbd15a"> 
    <table cellspacing="0" cellpadding="0" border="0" width="100%" xmlns:crwp="urn:schemas-microsoft-com:CategoryResultsWebPart" 
     xmlns:d="http://schemas.microsoft.com/sharepoint/dsp" xmlns:x="http://www.w3.org/2001/XMLSchema" 
     class="ms-sitedirresultssort"> 
     <tbody> 
      <tr> 
       <td width="100%" /> 
       <td nowrap=""> 
        <a href="#title">Sort by Title </a><span>| </span><a href="#url">Sort by Url </a> 
       </td> 
      </tr> 
     </tbody> 
    </table> 
    <table cellspacing="0" cellpadding="0" border="0" width="100%" xmlns:crwp="urn:schemas-microsoft-com:CategoryResultsWebPart" 
     xmlns:d="http://schemas.microsoft.com/sharepoint/dsp" xmlns:x="http://www.w3.org/2001/XMLSchema" 
     class="ms-sitedirresultspaging"> 
     <tbody> 
      <tr> 
       <td> : </td> 
      </tr> 
     </tbody> 
    </table> 
    <table cellspacing="0" cellpadding="0" border="0" width="100%" xmlns:crwp="urn:schemas-microsoft-com:CategoryResultsWebPart" 
     xmlns:d="http://schemas.microsoft.com/sharepoint/dsp" xmlns:x="http://www.w3.org/2001/XMLSchema" 
     class="ms-sitedirresultsbody" id="table2"> 
     <tbody> 
      <tr> 
       <td valign="top"> 
        <img alt="" src="/_layouts/images/lstbulet.gif" /> 
       </td> 
       <td width="100%" class="ms-sitedirresultstitle"> 
        <a href="http://site/cd10/_layouts/mysite.aspx?Redirect=1">Setup MySite</a> 
       </td> 
      </tr> 
      <tr> 
       <td /> 
       <td width="100%" class="ms-sitedirresultsurl"> 
        <a dir="ltr" href="http://site/cd10/_layouts/mysite.aspx?Redirect=1">http://site/cd10/_layouts/mysite.aspx?Redirect=1</a> 
       </td> 
      </tr> 
     </tbody> 
    </table> 
</div> 

Answer 1

<td> 
    : 
</td> 

不含:在任一浏览器，作为其后的换行符是一个空间中的不同。但是：

<td> : </td> 

现在在IE和Firefox中给出了不同的结果。 contains在IE中不匹配，因为它的解析器默默地扔掉了空白，就像IE喜欢做的那样。如果你看一下innerHTML看到：

<TD>: </TD> 

这勿庸置疑的选择不匹配。

因此，请注意contains和空格，因为IE的HTML解析器与以前一样古怪。

就我个人而言，我会尽量避免使用非标准的jQuery选择器，如:has，特别是:contains，因为他们需要jQuery来做很多慢的工作。另一方面，标准的CSS2-3选择器可以通过Selectors-API支持（包括IE8）在较新的浏览器中传递给浏览器自己的选择器引擎。

如何像：

$('.ms-sitedirresultssort ~ table td').filter(function() { 
    return this.text().match(/(^|\s):(\s|$)/); 
}) 

~为任何跟随同胞一个CSS3选择器; IE8确实支持它。

Answer 2

不知道是否是这种情况，但似乎可能是这个问题可能与空白...例如，如果我尝试你提供的HTML &尝试选择与$("td:contains(' : ')")（在Firefox中），我得到没有匹配，因为您试图匹配的td的内容实际上类似于：<td>\n....:\n.....</td>（对于新行，空格为. & \n）。换句话说，它不包含' : '，因为换行符（尽管选择了' :'作品）。所以它只是一个猜测，但也许IE8在创建DOM树时会清除原始空白，这意味着您的' : '选择器没有正确匹配。

因此，假设还会有别的td的与:的在他们&你刚过td跟单:（随机空白填充），你可以使用一个稍微不那么具体选择&然后过滤下来在功能上是这样的：

$("div[id^=WebPartWPQ]:has(table.ms-sitedirresultssort) td:contains(':')") 
    .filter(function() { return $.trim($(this).text()) == ":"; }) 
    .closest('div'); 

不太干净&可能有点慢，但可能是围绕一个合适的工作。