Javascript 传统获取DOM

时间：2023-10-02 00:37:02 lt固态继电器s216zk lt固态继电器s312zk lt固态继电器s303zl

Javascript 传统获取DOM

DOCTYPE html> <html lang="en">  <head>     <meta charset="UTF-8">     <meta http-equiv="X-UA-Compatible" content="IE=edge">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>传统的获取方式DOMtitle> head>  <body>     <div id="family">         <div class="father">             爸爸             <div class="son">儿子div>         div> div> <div id="b">我是divdiv> <span>我是spanspan> <ul> <li name="data-list" class="item-list">李昊哲li> <li name="data-list" class="item-list">李胜龙li> <li name="data-list" class="item-list">大美丽li> <li name="data-list" class="item-list">小可爱li> ul> <input type="text" name="account" id="account" value="admin"> <input type="password" name="password" id="password" value="admin"> body> html> <script> // 根据id获取 let family = document.getElementById('family'); console.log(family); // 根据 css类选择器 获取 // HTMLCollection let item_list = document.getElementsByClassName('item-list'); console.log(item_list); // console.log(item_list[0]); for (const li of item_list) { 
             console.log(li); } // 根据属性名name获取 // NodeList let data_list = document.getElementsByName('data-list'); console.log(data_list); data_list.forEach(li => { 
             console.log(li); }); // 根据标签名获取 // HTMLCollection let lis = document.getElementsByTagName('li') console.log(lis); for (const li of lis) { 
             console.log(li); } script>

锐单商城拥有海量元器件数据手册、IC替代型号，打造电子元器件IC百科大全！

Javascript 传统获取DOM

相关文章