微信公众号 讲师中心
首页
文章
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 自媒体 新闻
专题
后端开发 web前端 数据库 开发工具 php框架 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程 新闻
AI工具
AI 聊天问答 Agent智能体 AI 文本写作 AI 绘画作图 AI 设计工具 AI 视频创作 AI 音频制作 AI 办公学习 AI 编程开发 Prompt指令
学习
大前端 后端开发 数据库 移动端 运维开发 计算机基础
编程手册
大前端 后端开发 数据库 移动端 运维开发 计算机基础
下载
js特效 网站源码 工具下载 类库下载 网站素材 学习资源 插件扩展 手机/移动开发 手机游戏
最近更新
搜索
后端开发 web前端 数据库 开发工具 php框架 常见问题 科技 Java 系统教程 电脑教程 硬件教程 手机教程 软件教程 游戏教程
自媒体 新闻
首页 > web前端 > js教程 > 正文

解析dom中的children对象数组元素firstChild,lastChild的使用_javascript技巧

php中文网
发布： 2016-05-16 17:29:24
原创
1273人浏览过

复制代码 代码如下:




    
    
 
 
 
行1列1 行1列2
行2列1 行2列2
  
    
    
 
 
  
    
 
  
 
  

  <script> <BR> alert(test.children[0].tagName) <BR> alert(test.children[1].tagName) <BR> </script>  


document.all.tbl.children(0).children(0).innerHTML解释
document.all.tbl.children(0)定位到table的第一个子节点


document.all.tbl.children(0).children(0)定位到table的第一个子节点的第一个子节点,打印结果 行1列1 行1列2


document.all.tbl.children(0).children(1).innerHTML,打印结果

行2列1 行2列2


document.all.tbl.children(0).children(1).children(0).innerHTML 打印结果行2列2




Onlook
Onlook

专为前端设计师和开发者打造的视觉编辑工具

Onlook 108
查看详情 Onlook

    
    
 
 
 
行1列1 行1列2
行2列1 行2列2
  
    
    
 
 
  
    
 
  
 
  

  <script> <BR> alert(test.firstChild.tagName) <BR> alert(test.lastChild.tagName) <BR> </script>  


document.all.tbl.firstChild定位到table的第一个子节点


document.all.tbl.firstChild.firstChild定位到table的第一个子节点
的第一个子节点
document.all.tbl.firstChild.firstChild.innerHTML打印结果是 行1列1 行1列2


document.all.tbl.firstChild.lastChild定位到table的第一个子节点


的最后子节点
document.all.tbl.firstChild.lastChild.innerHTML打印结果是 行2列1 行2列2


document.all.tbl.firstChild.lastChild.firstChild.innerHTML 打印结果是
行2列2

大家都在看：

java速学教程(入门到精通)
java速学教程(入门到精通)

java怎么学习？java怎么入门？java在哪学？java怎么学才快？不用担心，这里为大家提供了java速学教程(入门到精通)，有需要的小伙伴保存下载就能学习啦！

下载
来源：php中文网
收藏 点赞
上一篇：JavaScript 模拟类机制及私有变量的方法及思路_javascript技巧 下一篇：js固定DIV高度,超出部分自动添加滚动条的简单方法_javascript技巧
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn
最新问题
JavaScript_计算机视觉与图像识别 JavaScript可通过TensorFlow.js、CanvasAPI等技术在浏览器中实现图像识别，支持实时摄像头分析、OCR、内容审核等应用，虽性能弱于Python，但在前端交互、隐私保护方面具有优势。
2025-11-23 08:27:35
598
动画实现：requestAnimationFrame优化技巧 合理使用requestAnimationFrame需控制频率、避免布局抖动、及时清理动画并结合CSS优化，如每3帧执行一次逻辑减少计算，批量读写DOM属性防止重排，动画结束调用cancelAnimationFrame释放资源，将位移缩放等交由CSS硬件加速处理，JavaScript仅控制复杂交互，从而实现流畅高效动画。
2025-11-23 08:20:44
182
JavaScript压缩优化_Tree Shaking原理分析 TreeShaking是一种通过静态分析剔除未使用代码的构建优化技术，应用于Webpack、Rollup和Vite等工具，依赖ES6模块的静态结构，在打包时移除“死代码”，减小文件体积。其原理是基于AST分析import/export依赖关系，从入口文件标记并保留被引用的代码，删除未使用的导出。为确保生效，应使用ES6模块语法，避免副作用，并在package.json中设置"sideEffects":false或指定必要文件。需注意它不支持CommonJS模块，且生产模式下才完全启用，开发环境通
2025-11-23 08:05:02
384
JavaScript代码生成_AST转换与代码重构 AST是JavaScript代码解析后的树状结构，每个节点代表语法单元；通过Babel等工具可遍历修改AST，实现如var转let、API迁移、自动埋点等精准重构，结合jscodeshift能批量安全升级项目代码。
2025-11-23 05:35:29
343
JavaScript_类型系统与TypeScript进阶应用 JavaScript是动态弱类型语言，变量类型在运行时确定，存在潜在错误风险；TypeScript通过静态类型系统在开发阶段捕获问题。JS有七种原始类型和对象类型，typeof和instanceof用于类型判断但有局限。TS提供类型注解、接口、泛型等机制，支持类型别名与接口定义结构，泛型结合条件类型、映射类型实现高级类型编程，如GetReturnType提取返回值类型。TS通过控制流分析自动窄化类型，支持自定义类型守卫、in和instanceof进行类型判断。装饰器可用于日志、权限校验、依赖注入
2025-11-23 03:31:06
605
JS Map数据结构_与Object对比 Map支持任意类型键且有序，性能更优；Object键仅限字符串或Symbol，语法简洁但无序，适合简单配置和JSON操作。
2025-11-23 02:31:16
554
Puppeteer高效提取页面多元素文本：解决爬取空白与效率问题 本教程旨在解决使用Puppeteer从网页中提取多个元素文本时遇到的常见问题，特别是登录后页面跳转未等待以及多元素循环提取效率低下导致的结果空白。文章将深入讲解如何通过page.waitForNavigation()确保页面加载完成，并推荐使用page.$$eval()方法在浏览器上下文中高效批量提取元素文本，从而提升爬取脚本的稳定性和性能。
2025-11-22 23:49:26
644
解决EJS模板中Mapbox数据传递的TypeError问题 本文旨在解决在EJS模板中集成Mapbox时，因数据传递不当导致的TypeError:Cannotreadpropertiesofundefined(reading‘coordinates’)错误。核心问题在于将JSON字符串化的对象再次用引号包裹，使其在客户端JavaScript中无法被正确解析为对象。通过移除EJS模板中JSON.stringify输出外部的额外引号，可确保数据作为有效的JavaScript对象字面量被直接赋值，从而使Mapbox能够正确访问地理坐标信息。
2025-11-22 23:06:25
576
JavaScript大数据_分布式计算处理 JavaScript可用于分布式计算，通过Node.js的流式处理、分片与worker_threads实现本地并行，结合主从架构与消息队列构建轻量级分布式系统，并集成Spark、Flink等生态完成大数据任务，适用于实时处理与前后端一体化场景。
2025-11-22 22:57:12
584
JavaScript渲染性能_重绘与回流优化策略 重绘与回流是JavaScript影响页面渲染性能的关键机制，回流因布局变化需重新计算几何属性，开销大且必引发重绘。频繁操作如修改尺寸、读取offset等会触发回流，优化策略包括：批量修改DOM、用CSS类替代内联样式、缓存布局信息、使用transform实现动画、合理启用硬件加速，并通过读写分离和requestAnimationFrame减少布局抖动，从而提升渲染效率。
2025-11-22 22:55:09
229
相关专题
更多>
热门推荐
开源免费商场系统广告
热门教程
更多>
相关推荐
热门推荐
最新课程
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网：公益在线php培训，帮助PHP学习者快速成长！
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • PHP学习

  • 技术支持

  • 返回顶部