现在我们来复习JavaScript。正如我提到的,JavaScript为您的网页添加了交互和功能。所以任何时候你想修改内容、更新事件,或甚至创建交互式元素,你也会用到JavaScript。简而言之,JavaScript用于交互式网页应用程序,并能处理前端以及后端部署。
所以如果你正在创建任何类型的网络应用或网站,不仅仅是页面上的简单文字。所以,我所说的页面上的简单文字是指如果你有一个只写着你好世界的网站,那将是一个简单的网站。但如果你想要比这更复杂的功能,比如页面之间相互链接、动画、用户界面内的交互性,那么你将需要JavaScript代码。
通常,您会在body标签的末尾添加您的JavaScript代码。所以我们可以看到这里,我们有我们的body标签,然后是内容。就在实际标签结束之前,这里有一个脚本标签。这通常是放置你的JavaScript代码的地方。
所以如果你想包含你的JavaScript代码内联,这是所有代码所在之处。所以你可以看到这第一个部分是从页面获取元素的,所以我们有一个标题和一个按钮。然后在这下面,JavaScript代码正在将标题颜色更改为随机颜色。每次点击此按钮,所以这意味着正如我提到的,这些JavaScript函数为您的网络应用增添了交互性。
所以每次你点击一个按钮,这些标题就会改变,根据此按钮接收到的点击次数进行颜色变化。
但有一点需要注意的是,处理JavaScript有一套正确的方法。因此,在大多数生产级代码中,JavaScript几乎总是位于其独立的文件中。所以我的意思是,与其把所有JavaScript代码都放在这里面,script标签,你在这里会做的是,你只需将脚本标签链接到一个单独的文件,正如你在这里看到的,我们想要链接到一个外部JavaScript文件,然后下一页是外部JavaScript文件。
所以这意味着你总是希望包含你的JavaScript代码分开存放而非置于单一文件中。所以你把HTML和CSS代码放在一个文件里,然后所有JavaScript代码应放在一个单独的文件中。这种分离使得代码更易于维护,这也使它更有条理。浏览器可缓存此内容,而这里的所有这些JavaScripi代码现在都可以在多个HTM页面中重复使用了。
现在这里的一个重要考虑是,这些仅仅是JavaScript的基础知识。因此,理解这些基础至关重要,但当我们开始构建时,借助NextS和React的AI功能,您实际上无需编写这些脚本标签。正如我提到的,React是一个库,而NextJS是构建在其之上的框架。因此,使用这两者实际上简化了代码,这样我们就不需要编写显式语法,因为该框架已经优化了我们的JavaScript。
所以这可能就是为什么使用NextJS和React生成的AI代码,看起来有点不同,我们将详细讨论这一点。