我试图得到class = 4的子span。下面是一个示例元素:

<div id="test">
 <span class="one"></span>
 <span class="two"></span>
 <span class="three"></span>
 <span class="four"></span>
</div>

我可用的工具是JS和YUI2。我可以这样做:

doc = document.getElementById('test');
notes = doc.getElementsByClassName('four');

//or

doc = YAHOO.util.Dom.get('#test');
notes = doc.getElementsByClassName('four');

这些在IE中不起作用。我得到一个错误,对象(doc)不支持此方法或属性(getElementsByClassName)。我已经尝试了几个跨浏览器实现getElementsByClassName的例子,但我不能让他们工作,仍然得到了这个错误。

我认为我需要的是一个跨浏览器getElementsByClassName或我需要使用doc.getElementsByTagName('span')和循环,直到我找到类4。但我不知道该怎么做。


当前回答

2018年6月更新至ES6

    const doc = document.getElementById('test');
    let notes = null;
    for (const value of doc) {
        if (value.className === '4') {
            notes = value;
            break;
        }    
    }

其他回答

YUI2有getElementsByClassName的跨浏览器实现。

下面是我如何使用YUI选择器做到这一点。感谢汉克·盖伊的建议。

notes = YAHOO.util.Dom.getElementsByClassName('four','span','test');

其中four = classname, span =元素类型/标签名,test =父id。

Let notes = document。querySelector(“#测试.four”)

现代的解决方案

const context = document.getElementById('context');
const selected = context.querySelectorAll(':scope > div');

文档

2018年6月更新至ES6

    const doc = document.getElementById('test');
    let notes = null;
    for (const value of doc) {
        if (value.className === '4') {
            notes = value;
            break;
        }    
    }