javaEE002.03 js的三种嵌入方式

系列文章目录

前言

前面我们讲了，css的三种嵌入方式，可以看前面的文章
https://blog.csdn.net/qq_41753340/article/details/110159132

css嵌入方式
* 行内：style属性中
* 内部：style标签中
* 外部：xxx.css文件中（建议使用）
那么js的嵌入方式是不是一样的呢？

一、 js的三种嵌入方式

js与css的三种嵌入方式差不多，也分行内、内部和外部

1、行内：书写在事件属性中，eg:

行内js，写在标签事件的属性中，结构和行为相耦合，不建议使用

2、 内部: 书写在

为什么获取不到btnId呢？
跟之前写的有什么不一样的地方
没有window.onload,等待页面加载完毕
怎么解决？
想办法让脚本代码html代码先执行，js代码后执行

解决办法1：把js代码放到最后面执行

这种就叫做内部的就是代码
解决办法2：使用window.onload 完美解决这个问题
js代码写在最后面能够解决这个问题，但是不是那么符合操作习惯，如果要完还是要使用window.onload（当然想少写一行代码，用第一种方式也是可以的）

window.onload 意思是 当前文档完全加载后执行，完全指的是包含音频、视频等

window.onload 在实际应用中不常见，因为如果有一部电影，2个小时，也要等它播放完毕之后才会执行

3、外部：书写在xxx.js文件中

剪切粘贴到.js文件中

也要使用src

如上图，需要注意，不能再写JavaScript代码，就算你写了，也不会执行，所以一定要注意
因为此时这个表情已经不是让你写JavaScript代码的了，它的功能以及变成了让你引入外部文件了
如果你非要写，有什么办法呢，很简单，再写一个script标签

需要注意的是一个页面中 window.onload 只能写一次


如上，demo.js里面的效果就没有了

优先级：就近原则

总结

1、
js的三种嵌入方式：

• 行内：书写在事件属性中，eg: < input οnclick=“alert()”>
• 内部: 书写在 < script > 标签中
• 外部：书写在xxx.js文件中
  优先级：就近原则

2、一个页面中 window.onload 只能写一次

3、如果script标签里面使用了 src属性，就不能继续再这个标签里面写js代码了