webAPI

通过别的元素找里面的一些元素

2019-05-07  本文已影响0人  椋椋夜色

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>通过别的元素找里面的一些元素</title>

<!-- 
    document来调用找元素的那些方法代表找到这整个页面里所有匹配的元素

    A元素来调用找元素的那些方法代表找到A元素下面所有匹配的元素


    getElementById只能通过document来调用,其他元素不能调用会报错

 -->

</head>
<body>

<ul id="ul1">
    <li>隔壁老王1</li>
    <li>隔壁老王2</li>
    <li>隔壁老王3</li>
    <li class="four">隔壁老王4</li>
    <li>隔壁老王5</li>
    <li id="li6">隔壁老王6</li>
    <li>隔壁老王7</li>
    <li>隔壁老王8</li>
    <li>隔壁老王9</li>
    <li>隔壁老王10</li>
</ul>

<ul>
    <li>隔壁老周1</li>
    <li>隔壁老周2</li>
    <li>隔壁老周3</li>
    <li class="four">隔壁老周4</li>
    <li>隔壁老周5</li>
    <li>隔壁老周6</li>
    <li>隔壁老周7</li>
    <li>隔壁老周8</li>
    <li>隔壁老周9</li>
    <li>隔壁老周10</li>
</ul>

<script>
    // 通过document来调用代表找到这个页面中所有匹配的元素
    // var liList = document.getElementsByTagName('li');
    // console.log(liList);

    //找到第一个ul里的所有的li
    // var ul1 = document.getElementById('ul1');
    // var liList = ul1.getElementsByTagName('li');
    // console.log(liList);

    // var list = document.getElementsByClassName('four');
    // console.log(list);//找到2个
    // var list = ul1.getElementsByClassName('four');
    // console.log(list);//找到1个

    var li6 = ul1.getElementById('li6'); //这里会报错
    console.log(li6);
    // getElementById只能通过document来调用,其他元素不能调用会报错
    
    
    
</script>

</body>
</html>

上一篇 下一篇

猜你喜欢

热点阅读