如何在javascript中获取子代

我想要的每个人都可以得到div下所有的p元素，类为“a1”，类为“oshow”，在类“pro_line”下是agian，而不需要在javascipt中使用getelementsbyclassname

 <div id="Zi03">
    <div class="ye">text</div>
    <div class="yee">text</div>
    <div class="pro-line">
         <div class="oshow">
         <div class="compic"><a href="#"></a></div>
         <p class="a1"><a href="poduct"></a></p>
         <p class="a2"><a href="poduct"></a></p>
         <div class="a3"><a href="poduct"></a></div>
        </div> 
         <div class="oshow">
         <div class="compic"><a href="#"></a></div>
         <p class="a1"><a href="poduct"></a></p>
         <p class="a2"><a href="poduct"></a></p>
         <div class="a3"><a href="poduct"></a></div>
        </div>
         <div class="oshow">
         <div class="compic"><a href="#"></a></div>
         <p class="a1"><a href="poduct"></a></p>
         <p class="a2"><a href="poduct"></a></p>
         <div class="a3"><a href="poduct"></a></div>
        </div> ...
        ....
        ....
    </div>
 </div>

文本
文本






...
....
....

请有人帮助我如何在不使用GetElementsByCassName的情况下在javascript中获取它，但我可以通过ID使用它

提前多谢

var elem = document.getElementById('Zi03');
var proline = elem.children[2];

For loop for all immediate childs of proline 
   var oshow= proline.firstElementChild;
   var a1 = show.children[1]
   //display a1 Or whatever you want
End 

---

如果a1和其他元素处于相同的层次结构级别，则可以使用以下替换来替换现代浏览器的

GetElementsByCassName（）

：

function getElementsByClassName(node, classname) {
        /// <summary>
        /// Replaces built-in function of modern browser. Implemented because not supported by IE7/8
        /// </summary>
        /// <param name="node">DOM element withing which search is done</param>
        /// <param name="classname">String with class name for search</param>
        /// <returns type="">Array of found elements</returns>

        var a = [];
        var re = new RegExp('(^| )' + classname + '( |$)');
        var els = node.getElementsByTagName("*");
        for (var i = 0, j = els.length; i < j; i++)
            if (re.test(els[i].className)) a.push(els[i]);
        return a;
    }

---

这里有一个版本让你开始，它并不完美，但你可以改进它

var nodes = [];
var allChildNodes = document.getElementById('Zi03').getElementsByTagName('*');
for  (var i = 0; i < allChildNodes.length); i++ ) {
    var isA1 = ;
    var isUnderProline =  allChildNodes[i].parentNode.className == 'pro-line';
    var isUnderOShow = allChildNodes[i].parentNode.parentNode.className == 'oshow';

    if (
            allChildNodes[i].className == 'a1' &&
            allChildNodes[i].parentNode.className == 'pro-line' &&
            allChildNodes[i].parentNode.parentNode.className == 'oshow'  

       ){
       nodes.push(allChildNodes[i]);
    }
}

var节点=[]；
var allChildNodes=document.getElementById（'Zi03'）.getElementsByTagName（'*'）；
for（var i=0；i

为什么不使用

getElementsByClassName（）

？使用像jQuery这样的库是一种选项吗？如果您使用的浏览器不支持

getElementsByClassName（）

（例如IE7）由于IE问题david..@maxim我只想用javascript实现该函数有一些自定义实现..这并不能确保您只在

oshow

下获得

.a1

在

pro-line

下，您需要多次调用getElementsByClassName，以确保遵循层次结构限制含蓄的当然，调用必须根据需要重复。我不同意这是隐式的，很容易受到诱惑，只需编写

getElementsByClassName（document.getElementById（'Zi03'），'a1'）

。它看起来像是半个解决方案。我认为它仍然具有误导性，因为它并没有完全回答这个问题

var nodes = [];
var allChildNodes = document.getElementById('Zi03').getElementsByTagName('*');
for  (var i = 0; i < allChildNodes.length); i++ ) {
    var isA1 = ;
    var isUnderProline =  allChildNodes[i].parentNode.className == 'pro-line';
    var isUnderOShow = allChildNodes[i].parentNode.parentNode.className == 'oshow';

    if (
            allChildNodes[i].className == 'a1' &&
            allChildNodes[i].parentNode.className == 'pro-line' &&
            allChildNodes[i].parentNode.parentNode.className == 'oshow'  

       ){
       nodes.push(allChildNodes[i]);
    }
}