如何写一段 JS 代码并运行|学习笔记

简介: 快速学习 如何写一段 JS 代码并运行

开发者学堂课程【JavaScript 入门与实战:如何写一段 JS 代码并运行】学习笔记,与课程紧密联系,让用户快速学习知识。

课程地址:https://developer.aliyun.com/learning/course/582/detail/8009


如何写一段 JS 代码并运行


内容介绍

一、引言

二、如何写-段 JS 代码并运行

 

一、引言

前边我们学习了 JavaScript  一些基本内容。同学们都有一些疑问,JS 很强大,但是要怎么学呢?我们知道 JS 要写到一个文件里,可是,是什么样的文件呢?JS 程序又要怎么写?写到什么地方呢?现在,我们就来解决这些问题。

 

二、如何写-段 JS 代码并运行

JavaScript 代码一般都会写在 Html 的文件里。也可能会写在一个 JS 文件里。分以几种方式来写。

(1)将 JS 代码写在 HTML 行内

例:新建一个 html. 文件,在 HTDOCS 目录下,命名 1.html。编辑:

1 < !DOCTYPE html>

2 <html lang="en">

3 <head>

4     <meta charset="UTF-8">

5     <meta name="viewport" content= "width=device-width,

initial -scale=1.0"

6    <meta http-equiv="X-UA- Compatible"content="ie=edge" >

7    <title>Document</title>

8  </head>

9  <body>

10   <!--将JS代码写在HTML行内-->

11  <input type-"button" value= "按钮”onclick=" alert(123)">

12  </body>

13  </html>

打开 Open InDefault Browser 浏览器,显示有一个按钮。点击按钮,能在浏览器里弹出一个内容为“此网页显示  123”的窗口。


(2)在 html 里面添加标签 script

将 JS 代码写在 script 标签中

例:在 1.html 里 9 <body> 后边编辑代码:

<script>

alert(345)

</script>

打开 Open InDefault Browser 文件,弹出一个内容为“此网页显示  345”的窗口。

 

(3)将外部的 JS 文件引入后执行

例:在 THDOCS 目录新建一个名为 1.js 的文件,编辑:

1 alert(567)

这种单独的 js 文件中的代码,是不能直接在浏览器中打开的;需要将 js 文件引入到html 中,浏览器打开 html 后js中的代码才会运行。继续在 1.html 里 9 <body>编辑代码:

<script src="./1.js">

</script>

这段代码为:将外部的 JS 文件引入后执行。

打开 Open InDefault Browser 文件,弹出一个内容为“此网页显示  567”的窗口。

注意:在这时候。Script 标签中就不要再写其他的js代码,写了也没有用。外部引用的方式加载 js 代码时,Script 标签内不需要再写代码,如果写了不会报错,但是也不会运行。

这就是如何写,在哪里写 JS 程序的三种方法。

相关文章
|
9天前
|
JavaScript 前端开发 Python
用python执行js代码:PyExecJS库
文章讲述了如何使用PyExecJS库在Python环境中执行JavaScript代码,并提供了安装指南和示例代码。
48 1
用python执行js代码:PyExecJS库
|
5天前
|
编解码 前端开发 JavaScript
javascript检测网页缩放演示代码
javascript检测网页缩放演示代码
|
7天前
|
Web App开发 JavaScript 前端开发
添加浮动按钮点击滚动到网页底部的纯JavaScript演示代码 IE9、11,Maxthon 1.6.7,Firefox30、31,360极速浏览器7.5.3.308下测试正常
添加浮动按钮点击滚动到网页底部的纯JavaScript演示代码 IE9、11,Maxthon 1.6.7,Firefox30、31,360极速浏览器7.5.3.308下测试正常
|
8天前
|
存储 JavaScript 前端开发
webSocket+Node+Js实现在线聊天(包含所有代码)
文章介绍了如何使用WebSocket、Node.js和JavaScript实现在线聊天功能,包括完整的前端和后端代码示例。
35 0
|
5天前
|
JavaScript 前端开发 API
Vue学习笔记3:对比纯JavaScript和Vue实现数据更新的实时视图显示
Vue学习笔记3:对比纯JavaScript和Vue实现数据更新的实时视图显示
|
4天前
|
存储 JavaScript 前端开发
改进JavaScript代码,给水果有序赋色
改进JavaScript代码,给水果有序赋色
|
6天前
|
存储 JSON JavaScript
JavaScript帮我编写快递自动分拣的代码,区分省份市区县城乡镇
JavaScript帮我编写快递自动分拣的代码,区分省份市区县城乡镇在JavaScript中编写一个用于快递自动分拣的代码,区分省份、市区、县、城乡镇,通常意味着你需要一个数据结构来存储这些地理区域的信息,并编写逻辑来根据快递地址中的信息将其分配到正确的分类中。 这里,我将提供一个简化的示例,说明如何使用JavaScript对象和函数来实现这一功能。请注意,这个示例是高度简化的,并且假设你已经有了某种方式(如正则表达式或API调用)来从快递地址中提取省份、市区、县等信息。 ----------------------------------- ©著作权归作者所有:来自51CTO博客作者goS
|
7天前
|
JavaScript 前端开发 Python
python执行js代码
本文档详细介绍如何安装Node.js环境及PyExecJS库,并提供示例代码展示其功能。首先,通过指定链接安装Node.js,安装完毕后可在命令行中输入`node --version`来验证安装是否成功。接着,使用`pip install PyExecJS`安装PyExecJS库,该库允许Python程序执行JavaScript代码。文档还提供了多个示例代码,展示了如何在Python环境中执行和编译JavaScript代码,并可以选择特定的JavaScript运行时环境,如Node.js或JScript。最后,通过具体案例展示了PyExecJS的功能与使用方法。
15 3
|
11天前
|
前端开发 JavaScript Java
JavaScript的运行原理
JavaScript 的运行原理包括代码输入、解析、编译、执行、内存管理和与浏览器交互几个步骤。当打开网页时,浏览器加载 HTML、CSS 和 JavaScript 文件,并通过 JavaScript 引擎将其解析为抽象语法树(AST)。接着,引擎将 AST 编译成字节码或机器码,并在执行阶段利用事件循环机制处理异步操作,确保单线程的 JavaScript 能够高效运行。同时,JavaScript 引擎还负责内存管理和垃圾回收,以减少内存泄漏。通过与 DOM 的交互,JavaScript 实现了动态网页效果,提供了灵活且高效的开发体验。
|
16天前
|
JavaScript
网站内容禁止复制的js代码
网站内容禁止复制的js代码
下一篇
无影云桌面