Javascript 无法使用jQuery选择器在IE8中选择HTML5元素的子元素_Javascript_Jquery_Dom_Html_Internet Explorer 8

Javascript 无法使用jQuery选择器在IE8中选择HTML5元素的子元素

javascript jquery dom html internet-explorer-8

Javascript 无法使用jQuery选择器在IE8中选择HTML5元素的子元素,javascript,jquery,dom,html,internet-explorer-8,Javascript,Jquery,Dom,Html,Internet Explorer 8,我发现一些帖子有类似的问题，但这是不同的。在我读了另一篇文章之后，我从jQuery1.4升级到了1.4.2，但问题仍然存在。我还试着在兼容模式下运行IE8，但似乎没有任何效果。当然，它在Chrome中工作得非常好以下是标记： <section class="pleaseWaitButton"> <p><img src="images/please_wait.png" alt="Please wait" /></p> <p&g

我发现一些帖子有类似的问题，但这是不同的。在我读了另一篇文章之后，我从jQuery1.4升级到了1.4.2，但问题仍然存在。我还试着在兼容模式下运行IE8，但似乎没有任何效果。当然，它在Chrome中工作得非常好

以下是标记：

<section class="pleaseWaitButton">
    <p><img src="images/please_wait.png" alt="Please wait" /></p>
    <p><input type="image" src="images/add_to_cart.png" alt="Add to cart"/></p>
</section>

以下是无法使用的jQuery选择器

$('.pleaseWaitButton').find('input').length // 0
$('.pleaseWaitButton input').length // 0
$('.pleaseWaitButton > p > input').length // 0

有什么想法吗？任何人…？

InternetExplorer8对HTML5、IE6和IE7有奇怪的支持，只是不支持而已

您需要修改HTML5元素，以便对其设置样式并正确使用innerHTML、getElementsByTagName等方法/属性

这将在IE6-IE8中起作用：

<!doctype html> 
<html> 
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]--> 
<section class="pleaseWaitButton"> 
    <p><img src="images/please_wait.png" alt="Please wait" /></p> 
        <p><input type="image" src="images/add_to_cart.png" alt="Add to cart"/></p> 
</section> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script> 
<script> 
    alert( $('.pleaseWaitButton').find('input').length ) 
    alert( $('.pleaseWaitButton input').length ) 
    alert( $('.pleaseWaitButton > p > input').length ) 
</script> 
</html>

Live Demo:

是IE8中不支持的HTML5元素，将其用作元素时会遇到问题，包括在其下查找子元素。这不是一个jQuery问题，而是一个基本的DOM问题：

我所做的只是给元素一个ID来简化事情：

<section class="pleaseWaitButton" id="btn">

这将使您在HTML5浏览器中获得2，在IE中获得0。

您可以手动创建元素，以便IE支持正确的样式和DOM操作。Jonathan Neal还修复了打印HTML5元素的问题，因为IE不支持原生的HTML5元素。@meder-True，我的答案是为什么不起作用，html5shiv代码有，所以它不是一个快速修复。作为补充说明，例如，在执行示例页面时，请确保具有有效的HTML，否则它不是有效的测试：@sfjedi-HTML文档需要一个示例：a，但这与我的测试用例无关。一个元素也是如此。幸运的是，我们在这里可能都足够聪明，能够理解这一部分。谢谢你的例子，meder。注意，shiv并不能解决新元素的所有问题；特别是innerHTML需要特别小心。我还不会使用HTML5语义容器元素：它们只会给你IE bug，但相对于div来说没有什么实际的好处。我要说的是，HTML5元素使我的css与我以前写的内容相比非常干净。例如，每次我为页面上的主项设置样式时，它总是我的文章元素，因此css是超级干净的，因为我只需要为文章元素设置样式。这只是一个例子。大多数情况下不需要ID。谢谢您的回答。到目前为止，它运行得很好。我从来没有使用innterHTML，所以这不会是一个问题。

<section class="pleaseWaitButton" id="btn">

document.getElementById('btn').children.length