JavaScript的书写方式

水深无声 2024-05-06 21:23 65阅读 0赞

## JavaScript的书写方式 ##

> 目前较为流行的是第二种和第三种，第一种很少见。在第二种和第三种推荐使用第三种，因为在日常开发/工作中，第三种是最为常见的

### 1.行内式 ###

把JS代码嵌入到html元素内部

**示例代码**

![image-20240228221932146][]

**运行效果**

![image-20240228222430887][]

由于JS中字符串常量可以使用单引号`''`表示, 也可以使用双引号`""`表示，所以上述代码还可以写为：

<input type="button" value="这是一个按钮" onclick='alert("哈哈哈")'>

注：HTML 中推荐使用双引号`""`，JS 中推荐使用单引号`''`

### 2.内嵌式 ###

通过`script`标签进行一个引入

**示例代码**  
![image-20240228223924629][]

**运行效果**  
![image-20240228225408722][]

### 3.外部式 ###

开发过程中非常常用的，用一个单独的js文件来写js代码，通过一个`src`把这个文件进行引入

**示例代码**  
demo03.js

alert("这是我在学习JS")

![image-20240228230145430][]

**运行效果**

![image-20240228230025350][]

[image-20240228221932146]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/06/1bed701c43364119b78e53771ee17c89.png
[image-20240228222430887]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/06/7f40588c3814427c8c05cf1d271131d2.png
[image-20240228223924629]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/06/1aee0828a49e45c2a116b7bd574d3199.png
[image-20240228225408722]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/06/c2383767e43c4318b64256f72d4907ae.png
[image-20240228230145430]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/06/ad53aac43fc44ac191eb991e9dc8d235.png
[image-20240228230025350]: https://image.dandelioncloud.cn/pgy_files/images/2024/05/06/b4e5c6603bb74cc291ed2593bb2b6d7a.png

发表评论取消回复

表情：

评论列表（有 0 条评论，65人围观）

还没有评论，来说两句吧...

相关阅读

相关 JavaScript的书写方式

JavaScript的三种书写方式

水深无声/ 2024年05月06日 21:23/ 0 赞/ 66 阅读

相关引入，CSS的书写方式

【1】为什么要学习CSS？ HTML画页面--》这个页面就是页面上需要的元素罗列起来，但是页面效果很差，不好看，为了让页面好看，为了修饰页面---》CSS CSS的作用：修

以你之姓@/ 2023年10月03日 22:54/ 0 赞/ 5 阅读

相关 CSS的书写方式

CSS的书写方式 <!DOCTYPE html> <html> <head> <meta ch

川长思鸟来/ 2023年09月27日 15:11/ 0 赞/ 111 阅读

相关引入，CSS的书写方式

【1】为什么要学习CSS？ HTML画页面--》这个页面就是页面上需要的元素罗列起来，但是页面效果很差，不好看，为了让页面好看，为了修饰页面---》CSS CSS的作用：修

骑猪看日落/ 2023年09月27日 13:38/ 0 赞/ 119 阅读

相关 JavaScript的常见用途和书写规范

JavaScript是一种基于对象和事件驱动并具有安全性能的脚本语言。 JavaScript常见用途: （1）可以直接写入HTML输出流 <script>

系统管理员/ 2023年01月12日 14:58/ 0 赞/ 95 阅读

相关 javascript 书写无缝滚动。

废话少说，献上demo [ 源码][Link 1] 大家自己下载看效果。先放上html代码： <!DOCTYPE html> <html> <h

╰半夏微凉°/ 2022年09月25日 13:17/ 0 赞/ 200 阅读

相关 jQuery 对应 JavaScript 书写

> [https://wildye.cn/posts/a25f9acc/][https_wildye.cn_posts_a25f9acc] DOM 属性 jQue

本是古典何须时尚/ 2022年05月29日 10:18/ 0 赞/ 70 阅读

相关 jquery文档就绪的三种书写方式

//写法一 $(document).read(function(){ alert("文档加载完毕!"); }) //写法二

素颜马尾好姑娘i/ 2022年05月19日 05:34/ 0 赞/ 188 阅读

相关 JS的书写方式及变量的声明

一、js书写方式 1、在<body></body>内的最末尾的位置中添加<script></script> 2、一般句尾加；（分号），（逗号）便于之后代码压

墨蓝/ 2022年04月23日 00:12/ 0 赞/ 466 阅读

相关 CSS的书写方式

CSS书写位置 1、嵌入：<style></style> 2、外联（外链）：<link rel="stylesheet" href="css/.." /> 3、内

系统管理员/ 2022年04月22日 17:26/ 0 赞/ 154 阅读