码迷,mamicode.com
首页 > 编程语言 > 详细

javascript基础--className选取节点

时间:2017-03-01 18:09:16      阅读:184      评论:0      收藏:0      [点我收藏+]

标签:节点   name   blog   style   javascrip   head   lang   ack   box   

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <script>
        function getByClass(oParrent, sClass) {
            var aEle = oParrent.getElementsByTagName(‘*‘);
            var aResult = [];
            var i = 0;

            for (i = 0; i < aEle.length; i++) {
                if (aEle[i].className == sClass) {
                    aResult.push(aEle[i]);
                }
            }
            return aResult;

        }
        window.onload = function() {
            var oUl = document.getElementById(‘ul1‘);
            var oBox = getByClass(oUl, ‘box‘);
            var i = 0;
            for (i = 0; i < oBox.length; i++) {
                oBox[i].style.background = "yellow";
            }
            // var aLi = document.getElementsByTagName(‘li‘);
            // var i = 0;
            // // alert(‘1‘);
            // for (i = 0; i < aLi.length; i++) {
            //     if (aLi[i].className == ‘box‘) {
            //         aLi[i].style.background = "red";
            //     }
            // }
        }
    </script>
</head>

<body>
    <ul id="ul1">
        <li></li>
        <li></li>
        <li class="box"></li>
        <li></li>
        <li></li>
        <li class="box"></li>
        <li class="box"></li>
        <li></li>
    </ul>
</body>

</html>

 

javascript基础--className选取节点

标签:节点   name   blog   style   javascrip   head   lang   ack   box   

原文地址:http://www.cnblogs.com/Mr-W/p/6485387.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!