青训营字节 MarsCode 技术训练营第七课 | 豆包MarsCode AI 刷题

68 阅读2分钟

前段时间,我开始了《Head First HTML5 Programming》的学习(来自范老师文章里的推荐)

当时看到这本书的时候,想起来之前上web课的时候用过《Head First HTML And CSS》,也算是衔接上了哈哈。

这本书的实操部分比较多,这种学习方式也能让我们更快地掌握JS相关知识。

javaScript中,我们可以在for和while语句中使用一个布尔表达式作为条件测试,来确定是否继续循环。在JavaScript中还可以用布尔表达式做出判断。

<!doctype html>
<html>

```js
My First JavaScript ```

image.png

运行代码后会把文本写入文档中,通过这个例子,我们知道了如何动态地改变一个页面。

在本例中使用到的是while循环,for循环同样也是实现类似的效果。通常,for循环更习惯对于固定数目的值完成迭代,而while循环更适合不断循环直至满足某个条件(如为用户提供测试直至完成)。

在对JavaScript有了基础的了解之后,我们可以继续学习如何在页面中增加JavaScript

  1. 放在<head>元素中 最常用的方式就是在页面的元素中放置<script>元素,但要注意的是,浏览器开始解析head部分就会执行这个代码。
  2. 引用单独的JavaScript文件 具体操作是将文件的url放在<script>的src属性中,如果在同一目录下,可以直接使用文档名。
  3. 放在<body>中 浏览器解析body时就会执行对应的JavaScript代码。

JavaScript如何与页面进行交互呢?答案是通过DOM,即文档对象模型。在浏览器中加载一个页面时,浏览器会解析HTML,并创建文档的内部模型,简称为DOM。

JavaScript可以与DOM交互来访问元素以及元素中的内容,操作如创建、增加、删除、修改元素。

JavaScript修改DOM时,浏览器会动态更新页面。

还需要注意的一点时,JS代码放置的位置也会影响页面的更新。如果直接把全部的JS代码放在Head部分,就会在浏览器第一次加载页面的Head部分并且在加载其他部分之前执行,这时DOM还没有完成创建,当然无法完成操作,可以通过window.onload = init;,在函数init里写入具体的JS代码。

这本书涉及到的知识还是相当多的,今天只介绍这一小块叭。