2024年最新进阶版JavaScript学习【第一期】_var timer = document，2024年最新程序员必学之一

既有适合小白学习的零基础资料，也有适合3年以上经验的小伙伴深入学习提升的进阶课程，涵盖了95%以上大数据知识点，真正体系化！

由于文件比较多，这里只是将部分目录截图出来，全套包含大厂面经、学习笔记、源码讲义、实战项目、大纲路线、讲解视频，并且后续会持续更新

需要这份系统化资料的朋友，可以戳这里获取

基础还是关键。

欢迎大家的一键三连。

给大家安利一个刷题神器：牛客网

JavaScript系列刷题指南：点往此处

---

目录

API和Web API

1、API

2、Web API

DOM介绍

DOM树

获取元素

1、根据ID获取 getElementById（）

3、通过HTML5新增的方法获取

获取特殊元素（body、html）

---

API和Web API

1、API

应用程序编程接口（API）是一些预先定义的函数，目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力，而又无需访问源码。

API是给程序员提供的一种工具，以便能更轻松实现想要完成的功能。

2、Web API

浏览器提供的一套操作浏览器功能和页面元素的API（BOM和DOM）

一般都有输入和输出（函数的传参和返回值），Web API很多都是方法（函数）。

---

DOM介绍

DOM：文档对象模型（Document Object Model），是W3C组织推荐的处理可扩展标记语言的标准编程接口，DOM接口可以改变网页的内容、结构和样式。

通过DOM获取过来的元素是一个对象（Object），所以称为文档对象模型。

DOM树

1. 文档：一个页面就是一个文档，DOM中使用document表示。
2. 元素：页面中的所有标签都是元素，DOM中使用element表示。
3. 节点：网页中的所有内容都是节点，DOM中使用node表示。

---

获取元素

语法格式：

document.（？）

1、根据ID获取 getElementById（）

<div id='time'>2022-6-12</div>
<script>
  var timer=document.getElementById('time');
  console.log(timer);
</script>

1. 因为文档页面从上往下加载，所有先得有标签，script现在标签下面。
2. getElementById=get获得element元素通过（by）Id。
3. 参数id是大小写敏感的字符串。
4. 返回的是一个元素对象。
5. console.dir（）：打印返回的元素对象，更好的查看里面的属性和方法。

2、根据标签名获取getElementsByTagName(‘标签名’)

getElementsByTagName( ) 可以返回带有指定标签名的对象集合。

<ul>
    <li>my name is guidm</li>
    <li>my name is guidm</li>
</ul>
<script>
    var lis=document.getElementsByTagName('li');
    consle.log(lis);
    consle.log(lis[0]);
</script>

1. 返回的是获取过来元素对象的集合，以伪数组的形式存储的。
2. 我们想要以此打印里面的元素对象，可以采取遍历的方式，得到的元素是动态的。
3. 如果页面中只有一个元素，返回的还是伪数组的形式。
4. 如果页面中没有这个元素，返回的是一个空的伪数组。

3、通过HTML5新增的方法获取

网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。

需要这份系统化资料的朋友，可以戳这里获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！

的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。**

需要这份系统化资料的朋友，可以戳这里获取

一个人可以走的很快，但一群人才能走的更远！不论你是正从事IT行业的老鸟或是对IT行业感兴趣的新人，都欢迎加入我们的的圈子（技术交流、学习资源、职场吐槽、大厂内推、面试辅导），让我们一起学习成长！