关于HTML文件、JS文件、CSS文件
把JS和CSS脚本写在html里和写在独立文件里有什么区别？
1. 都写在html里是性能最优的方案。
2. 都写在html里是可维护性最差的方案。
3. 分开写在js、css、html是可维护性最有的方案。
4. 分开写在js、css、html是性能最差的方案。
5. 折中一下，不可复用的js和css直接写在html中。
6. 再优化下，把js都打包在一个文件里，css也打包在一个文件，减少http请求。
7. 以上都过渡完了，那个时候会有一群人叫你大神。
js的三种使用方式（行内js、内部js、外部js）
1、行内js：js不单独写出
1. <!DOCTYPE html> 2. <html lang="en"> 3. <head> 4. <meta charset="UTF-8"> 5. <title>js使用方式1：行内js</title> 6. </head> 7. <body> 8. <input type="button" value="点击有惊喜" onclick="javascript:alert('哈哈哈哈')"> 9. <!--onclick:点击触发一个事件，alert：弹出一个对话框--> 10. </body> 11. </html>
2、内部js：script里的程序整个页面都可以用
1. <!DOCTYPE html> 2. <html lang="en"> 3. <head> 4. <meta charset="UTF-8"> 5. <title>js使用方式2：内部js</title> 6. <script type="text/javascript"> 7. //声明一个函数(整个文档都可以使用) 8. function surprise() { 9. alert('恭喜你中了一百万') /*弹出框*/ 10. } 11. </script> 12. </head> 13. <body> 14. <input type="button" value="点击有惊喜" onclick="surprise()"><!--调用函数--> 15. <input type="button" value="点击" onclick="surprise()"> 16. </body> 17. </html>
3、外部js：很多html页面都可以调用设定的js页面
1. <!DOCTYPE html> 2. <html lang="en"> 3. <head> 4. <meta charset="UTF-8"> 5. <title>js使用方式3：外部js</title> 6. <!--很多html页面都可以调用js4.js页面--> 7. <script src="../../js/js4.js" type="text/javascript" charset="utf-8"> 8. </script> 9. </head> 10. <body> 11. <input type="button" value="点击" onclick="test()"> 12. </body> 13. </html>
