JavaScript 获取 HTML 中特定父元素下的子元素

JavaScript 获取 HTML 中特定父元素下的子元素

html 复制代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>查找子元素示例</title>
</head>
<body>
 
<div id="parent">
  <p>第一个子元素</p>
  <span>另一个子元素</span>
  <div>
    <a href="#">链接</a>
  </div>
</div>
 
<script>
	// 获取父元素
	var parent = document.getElementById('parent');
	// 查找特定子元素
	var divChildren = parent.querySelector('div');
	var spanChildren = parent.querySelector('span');
	// 查找所有子元素
	var children = parent.querySelectorAll('*');
	// 输出找到的子元素
	children.forEach(function(child) {
	  console.log(child.tagName); // 打印标签名
	});
</script>
 
</body>
</html>
相关推荐
万少1 小时前
DeepSeek 昨晚刚开源了 Harness:附万少的2 万字保姆级教程
前端·后端·架构
程序员黑豆3 小时前
Java字符串详解
java·前端·ai编程
无我Code4 小时前
开发者-2026年中总结
前端·面试·程序员
To_OC4 小时前
LC 560 和为 K 的子数组:前缀和配哈希表,这对组合我是真的服了
javascript·算法·程序员
浮生望5 小时前
React 受控与非受控组件:从表单状态管理到实时校验的完整实践
前端
明朝百晓生5 小时前
Deep RL learning[2026/8]
开发语言·javascript·人工智能
糖墨夕6 小时前
第二章:AI Agent 到底是个啥?—— 用生活场景把概念讲明白
前端
Csvn6 小时前
⚡ content-visibility: auto —— 长页面渲染提速的隐藏神器,白捡的性能优化
前端
用户938515635076 小时前
ESLint 代码规范完全指南——从 AST 原理到 flat config 逐行解析
javascript·后端·代码规范
用户938515635076 小时前
深入理解 Next.js:从 SPA 的 SEO 问题到约定式路由与 SSR 原理
前端·后端·全栈