html嵌入javascript代码的三种方式
一、概念
javascript是运行在浏览器中的脚本语言，运行在浏览器的内存当中，不需要程序员手动编译，编写玩源代码之后，浏览器直接打开解释执行，简称JS。
二、html嵌入javascript代码的三种方式
JS是一门事件驱动型的编程语言，依靠事件去驱动，然后执行对应的程序。
例如：在JS中有很多事件，其中有一个事件叫做：鼠标单击，click，并且任何事件都会对应一个事件句柄onclick。
1.事件句柄是以html标签的属性存在的。
在按钮标签中设置onclick属性值，则点击按钮发生click事件后，注册在onclick后面的js代码会被浏览器自动调用。
示例如下：
解释：（1）在JS中有一个内置的对象window,代表浏览器对象（窗口），window对象有一个函数alert，用法是window.alert(“消息”)，点击按钮后弹出带有消息的窗口，"window."可以省略不写直接写alert语句；
（2）java字符串可以使用双引号，也可以使用单引号；
（3）JS的一条语句结束之后可以使用分号也可以不用。
（4）window.alert()语句在显示窗口时并没有执行完，点击确认窗口消失后才执行完（alert有阻塞当前页面加载的作用）。
2.脚本块的方式
在body标记中嵌入script标记，JS代码写在script标记中。此时的代码在页面打开时执行，并且遵循自上而下的顺序依次执行，即代码的执行不需要事件。javascipt的脚本块可以有多个，可以出现在任意位置。javascript可以有//开头的单行注释和/**/包含的多行注释。
示例如下：
效果如下：
刷新页面后一直在加载页面，也没有显示input标记，点击确定后页面加载完毕：
3.引入外部独立的.js文件
.js文件内容与脚本块的方式中script标记中的内容一致。代码也会按照顺序自上而下地执行。同一个.js文件可以被引入多次。
引入方式，在body 标记中加script标签；
到此这篇关于html嵌入javascript代码的三种方式的文章就介绍到这了,更多相关html嵌入javascript内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
我想在页面里把想要的关键词加亮凸出(用颜色区分出来)显示,这样让客户一眼能看到重的东西,然后在加亮的关键词上可以加上超连接.请问高手们怎么实现宋的功能.就像搜索引擎的那种..搜索关键词的时候就显示红色的.2008-06-06
Babel 是一个广泛使用的 ES6 转码器，可以将 ES6 代码转为 ES5 代码，从而在老版本的浏览器执行，这意味着，你可以用 ES6 的方式编写程序，又不用担心现有环境是否支持，这篇文章主要介绍了ES6代码转ES5教程(babel安装使用教程),需要的朋友可以参考下2023-01-01
这篇文章主要介绍了ES6 Set结构的应用,结合实例形式分析了ES6 set结构的功能、特点、常见用法及相关操作注意事项,需要的朋友可以参考下2019-06-06
这篇文章主要介绍了微信小程序实现活动报名登记,本篇将介绍使用微信小程序实现发起一个活动报名的设计，以此为基础，我们可以掌握微信小程序表单的基本用法，进而在诸如疫情信息登记、出入报备等场景中使用小程序进行开发，满足相关的需求，需要的朋友可以参考下2022-09-09
一个小项目中用到，奉命进行修改，定位到2009-03-03
javascript结合html5 canvas实现(可调画笔颜色/粗细/橡皮)的涂鸦板
js+html5 canvas实现的涂鸦画板特效,可调画笔颜色|粗细|橡皮,可以保存涂鸦效果为图片编码，测试了下还不错，感兴趣的朋友可以参考下2013-04-04
大家在使用微信小程序的时候会有缓存,虽然小程序的缓存数值相比APP要少的多,下面这篇文章主要给大家介绍了关于如何清除手机上小程序缓存的相关资料,需要的朋友可以参考下2022-08-08
JS和CSS让页面每次刷新随机产生一张背景图，当然我的回答是可以的，下面是具体的实现思路，感兴趣的朋友可以参考下2014-03-03
webpack4 配置 ssr 环境遇到“document is not defined”
这篇文章主要介绍了webpack4 配置 ssr 环境遇到“document is not defined”，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-10-10
这篇文章主要为大家详细介绍了javascript实现移动的模态框效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-09-09
最新评论