javascript - Javascript 函数在 IE 中返回未定义

Question

我遇到了这段代码的问题，它可以在除 IE 之外的所有浏览器上运行。

HTML

<div class="separator">
<a href="http://www.domain.com/images/s1920/original.jpg">
<img height="250" src="http://www.domain.com/images/s400/photo.jpg" />
</a>
</div>

JAVASCRIPT

<script type='text/javascript'>
var ImageSource = document.getElementsByClassName('separator')[0].getElementsByTagName('a')[0].href;
ImageSource = ImageSource.replace(/0\//, '0-d/');
</script>

它按预期工作，但是当我在 IE 上测试时它返回此错误，

Message: Object doesn't support this property or method

可能是什么问题呢？

Answer 1

.getElementsByClassNameIE8 或更早版本不支持。

您可以改用.querySelector()它，它在 IE8 和所有其他现代浏览器中都可以使用。

var ImageSource = document.querySelector('.separator').getElementsByTagName('a')[0].href;

请注意，它querySelector()返回单个元素（因此[0]在上面的代码中它后面没有 a）。在给定的示例中，您只需要一个元素，但如果您需要多个元素，与 相同.getElementsByClassName()，那么您可以使用.querySelectorAll().

另请注意，以上所有内容仅适用于 IE8 及更高版本。如果您需要支持 IE7，那么您将不得不寻找另一个解决方案。可能您最好的选择是 jQuery，因为 IE7 没有内置的本机解决方案。

希望有帮助。

Answer 2

好吧，如果您使用的是 IE8，那么不支持 getElementsByClassName

见http://caniuse.com/getelementsbyclassname