JavaScript获取元素的七种方式

码龄2年

关注

原创最新推荐文章于 2025-07-22 20:04:59 发布 183 阅读 GEO检测

HTML之JavaScript DOM编程获取元素的方式 var aaa = document.getElementById("username") // 根据元素的id值获取页面上的唯一一个元素,有同名的则返回找到的第一个。var firstc = div01.firstElementChild// 通过父元素获取第一个子元素。var cs = div01.children // 获取全部子元素。// 根据元素属性名获取元素，返回数组，循环迭代时慎用for in 会获取到其他的东西。// 根据元素的id值获取页面上的唯一一个元素,有同名的则返回找到的第一个。阅读详情

// 操作DOM
获取元素
1.获取id

var ids = document.getElementById("ids");
 console.log(ids);

2.获取class(集合)

 var box = document.getElementsByClassName("box")[0];
  console.log(box);

3.获取标签(集合)

 var divs = document.getElementsByTagName("div")[0];
   console.log(divs);

4.获取name属性(集合)

 var names = document.getElementsByName([name="demos"]);
  console.log(names);

5.可以获取所有选择器

var demo1 = document.querySelector("#ids");
var demo2 = document.querySelector(".box");
var demo3 = document.querySelector("div");
var demo4 = document.querySelector("[type]");
var demo5 = document.querySelector("[type='text']");
   console.log(demo1);
   console.log(demo2);
   console.log(demo3);
   console.log(demo4);
   console.log(demo5);

6.可以获取所有选择器(集合)

var test1 = document.querySelectorAll(".box")[0];
 console.log(test1);

7. 获取元素中属性值

       元素.getAttribute("属性名");
       元素.setAttribute("属性值","值");
       元素.removeAttribute("属性名");

标签

#javascript #前端 #vue.js

本内容遵循 CC 4.0 BY-SA 版权协议

解锁全志T113-i隐藏技能：用RISC-V核跑实时系统比STM32还稳？本文深入探讨了全志T113-i SoC的异构架构潜力，重点解析如何利用其内置的玄铁C906 RISC-V核心独立运行实时系统。通过对比传统MCU与Linux方案，文章提供了从RISC-V核心启动、FreeRTOS移植到与Linux主核进行高效异构通信的完整实战指南，为工控等需要兼顾丰富应用与硬实时控制的场景提供了高集成度的单芯片解决方案。阅读详情

JavaScript获取元素的七种方式

相关推荐