发表于： 2019-09-25 10:40:03
2 978
今天完成的事：对任务14js的理解；对任务12的js重新理解；
明天要完成的事：开始js任务1；
难题：刚开始看DOM完全没法理解；知识点太多一下子串不起来；API真心绝望；完全不知道怎么说
收获：首先
预先把一些复杂的操作写在一个函数里面，编译成一个组件（一般是动态链接库），随操作系统一起发布，并配上说明文档，程序员只需要简单地调用这些函数就可以完成复杂的工作，让编程变得简单有趣。这些封装好的函数，就叫做API(Application Programming Interface)，即应用程序编程接口。
说得更加通俗易懂一些，别人写好的代码，或者编译好的程序，提供给你使用，就叫做API。你使用了别人代码（或者程序）中的某个函数、类、对象，就叫做使用了某个API。
（综上可得：API就是不同模块或者不同软件之间衔接的一种约定和协议类似或者是协议的一种；变相理解一下各种编程语言自带的标准库其实也是API。标准库即协议的一种延伸）
https://blog.csdn.net/ljh_gemini/article/details/86551799
然后DOM是文件对象模型：
2.1DOM是什么？https://blog.csdn.net/jnshu_it/article/details/88361992
DOM是Document Object Model（文档对象模型）的缩写。DOM就是一个编程接口，就是一套API，是针对HTML文档、XML等文档的一套API。
DOM用来访问或操作HTML文档、XHTML文档、XML文档中的节点元素。JavaScript可以通过DOM来访问和操作HTML文档所有的元素。JavaScript是一种脚本语言，DOM是用来获得和操作HTML文档的节点属性。JavaScript通常是通过DOM来获得和操作HTML属性的。
2.2什么是DOM节点？
HTML文档中的所有内容都是节点
整个文档是一个文档节点
每个HTML元素是元素节点
HTML元素内的文本是文本节点
每个HTML属性是属性节点
注释是注释节点
html DOM 属性是节点（HTML 元素）的值，您能够获取或设置。
HTML DOM 定义了访问和操作 HTML 文档的标准。
相关阅读：
节点：
节点父、子和同胞
节点树中的节点彼此拥有层级关系。
父（parent）、子（child）和同胞（sibling）等术语用于描述这些关系。父节点拥有子节点。同级的子节点被称为同胞（兄弟或姐妹）。
- 在节点树中，顶端节点被称为根（root）
- 每个节点都有父节点、除了根（它没有父节点）
- 一个节点可拥有任意数量的子
- 同胞是拥有相同父节点的节点
根据 W3C 的 HTML DOM 标准，HTML 文档中的所有内容都是节点：
- 整个文档是一个文档节点
- 每个 HTML 元素是元素节点
- HTML 元素内的文本是文本节点
- 每个 HTML 属性是属性节点
- 注释是注释节点
通过 HTML DOM，树中的所有节点均可通过 JavaScript 进行访问。所有 HTML 元素（节点）均可被修改，也可以创建或删除节点。
总的来说，
HTML DOM 定义了用于 HTML 的一系列标准的对象，以及访问和处理 HTML 文档的标准方法。
通过 DOM，可以访问所有的 HTML 元素，连同它们所包含的文本和属性。可以对其中的内容进行修改和删除，同时也可以创建新的元素。
HTML DOM 独立于平台和编程语言。它可被任何编程语言诸如 Java、JavaScript 和 VBScript 使用。
DOM的妙处在于：它能够在所有浏览器上提供一种一致的方式，通过代码访问HTML的结构和内容。
1、在浏览器加载一个页面时，浏览器会解析HTML，并创建文档的一个内部模型，其中包含HTML标记的所有元素，自上而下解析，遇到JavaScript浏览器会检查它的正确性，然后执行代码。
2、JavaScript继续执行，使用DOM检查页面、完成修改、从页面接受事件，或者要求浏览器从Web服务器获取其它数据
注：document是一个反映HTML的对象，通过调用document的方法改变DOM的状态，也就是改变HTML页面
3、JavaScript修改了DOM时，浏览器会随着动态更新页面。
DOM就是一张映射表啦，记录着一堆用代码操控document时的规章制度，直白点说，就是js操作html时的API
(感觉这个东西有一点印象不过还是需要实际使用才能得出自己的理解）
关于
JavaScript原生态获取DOM对象,获取属性值以及设置属性值
一.获取DOM对象(标签,元素,节点)的三种方法
1.document.getElementById(); 根据元素的id获取当前的标签
例如
<p id="demo"></p
document.getElementById('demo');获取ID为demo的元素
2.document.getElementsByTagName();根据元素的标签获取当前的标签,
例如
<li></li>
<li></li>
<li></li>
var oDom = document.getElementsByTagName('li')
注意,该方法返回的是一个数组,即oDom .length == 3,
3.document.getElementsByClassName();根据元素的类名获取当前的标签,
注意: 这是HTML5 DOM中新增的一个方法,所以某些DOM可能还无法实现,且该方法和
document.getElementsByTagName()方法都是返回的一个数组.
感觉不知道咋说：上面是找到元素
div ：就是用docume.getElementById（“元素的id”）先获取元素；在更改元素的属性
removeAttribute() 方法来删除DIV元素中的属性
<div id="mochu" title="hello word!"></div>
<script>
document.getElementById('mochu').removeAttribute('title');
</script>
getAttribute() 方法获取DIV元素属性的值，
<div id="mochu" title="飞鸟慕鱼博客"></div><script>
var title = document.getElementById('mochu').getAttribute('title');
console.log(title);
</script>
修改DIV元素中的指定属性的值，可以使用 setAttribute() 方法
<div id="mochu" title="飞鸟慕鱼博客"></div>
<script>
var title = document.getElementById('mochu').getAttribute('title');
console.log(title);
</script>
input的改变方法
var inputDom = document.getElementById("text");//找到元素，假如给input元素加了id属性 且 值为:text
var text = inputDom.value; //获取元素值
Checkbox ：
js的使用：
HTML 中的脚本必须位于 <script> 与 </script> 标签之间。
脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。
（一般按照规范js脚本放在body的底部内联的情况下）
js的数据类型：
堆（Heap）内存
所有的应用可以从一个系统共有的空间中申请供自己使用的内存，这个共用的空间就叫做Heap；建立对象时，在Heap中的内存实际建立这个对象，而对象实例在Heap中分配好以后，需要在Stack中保存一个4字节的Heap内存地址，用来定位该对象实例在Heap中的位置，便于找到该对象实例
栈（Stack）内存
每个应用程序用于存放临时变量、参数传递、函数调用时的值的保存的内存空间，就叫Stack；在建立对象时，Stack中分配的内存只是指向这个对象的指针（引用）而已
堆（Heap）和栈（Stack）的区别
1.系统区别
Stack的空间很小，存取速度仅次于寄存器，存储效率比Heap高，空间有限，Stack中的数据可以共享，但是存储在Stack中的数据大小和生存期必须是确定的，缺乏灵活性
Heap的空间是很大的自由区，存取速度较慢，可以动态的分配内存大小
2.存储时间
Stack的空间是由操作系统自动分配和释放，不存在内存回收问题
Heap是随机分配内存，不定长度，存在内存分配和回收问题；因为JVM的GC进程会定期扫描Heap，它根据Stack中保存的4字节对象地址扫描Heap，定位Heap中的这些对象，进行一些优化（例如合并空闲内存块），并且假设Heap中没有扫描到的区域都是空闲的，统统refresh（实际上操作是把Heap中丢失了对象地址的无用对象清除了），这就是垃圾清理的过程
一些看不完的概念：jvm：https://blog.csdn.net/csdnliuxin123524/article/details/81303711
今天晚上时间全花在配置node.js和安装上了气死了；
最后10点半总算搞定了；最后半个小时把js外接上去了；
明天接着看资料；今天的资料看的有点晕
返回列表
评论