关于HTML文件、JS文件、CSS文件
2024-08-29 20:46:55
把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>
最新文章
- JavaScript代码段整理笔记系列（二）
- HTML5 File API — 让前端操作文件变的可能
- ThinPHP基础
- Selenium2学习-042-Selenium3启动Firefox Version 48.x浏览器（ff 原生 geckodriver 诞生）
- 浅探委托（delegate）和事件（event）
- 在VS2010中创建并引用dll(C#)
- Hive UDF 实验1
- paste DEMO合并文件
- 用while循环语句计算1！+2！+……20！之和
- 懒人福利:Xcode插件将JSON格式化输出为模型的属性->ESJsonFormat-Xcode
- 第四十五篇、UITableViewCell高度计算
- SQL Server查询性能优化——创建索引原则（一）
- git的一些基础命令
- Candies(差分约束)
- PHPCMS二层栏目调用
- cobol语言基础培训教程
- What is Observer and Observable and when we used these?
- PAT (Advanced Level) 1082. Read Number in Chinese (25)
- python小工具：用python操作HP的Quality Center
- pandas.DataFrame.describe 官方文档翻译percentile_width，percentiles，include, exclude