在HTML中使用JavaScript的两种方法


Posted in Javascript onDecember 24, 2020

在HTML中使用HTML需要借助<scirpt>标签,使用<script>标签的方式有两种:一种是直接在<script>标签中嵌入JavaScript代码,另一种是用<script>的src属性引入外部JavaScript文件。

直接在页面嵌入JavaScript代码

在使用<script>标签嵌入JavaScript代码时,只需为<script>指定type属性。然后,像下面这样把JavaScript代码直接放在标签内部即可:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>
  <script type="text/javascript">
    var word = "Hello, itbsl";
    alert(word);
  </script>
</head>
<body>
</body>
</html>

在HTML中使用JavaScript的两种方法

<script>的type属性可以不要,这是因为当初标准的制定者认为标签内嵌入还可能会嵌入其他语言,需要用type来指定标签内的语言,但是发展到至今大家已经知道,这里只会嵌入JavaScript,目前所有浏览器的默认值就是text/javascript。

HTML文件内可以嵌入任意多个script标签。

引入外部JavaScript文件

如果要通过<script>标签包含外部JavaScript文件,那么src属性是必须的。这个属性的值是一个指向外部JavaScript文件的链接,例如:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>title</title>

  <script type="text/javascript" src="./js/example.js"></script>

</head>
<body>
</body>
</html>

在HTML中使用JavaScript的两种方法

注意:带有src属性的<script>标签不应该在其<script>和</script>标签之间再嵌入任何JavaScript代码。如果嵌入了额外的JavaScript代码,则只会下载并执行src引入的外部脚本文件,嵌入的代码会被忽略。

在HTML中使用JavaScript的两种方法

以上就是在HTML中使用JavaScript的两种方法的详细内容,更多关于HTML中使用JavaScript的资料请关注三水点靠木其它相关文章!

Javascript 相关文章推荐
JavaScript 调试器简介
Feb 21 Javascript
JS完成代码前最好对其做5件事
Apr 07 Javascript
JQuery each打印JS对象的方法
Nov 13 Javascript
jQuery判断checkbox是否选中的小例子
Dec 02 Javascript
jQuery实现级联菜单效果(仿淘宝首页菜单动画)
Apr 10 Javascript
JavaScript动态改变表格单元格内容的方法
Mar 30 Javascript
浅析Javascript匿名函数与自执行函数
Feb 06 Javascript
学习使用jquery iScroll.js移动端滚动条插件
Mar 24 Javascript
vue.js+Echarts开发图表放大缩小功能实例
Jun 09 Javascript
vue 界面刷新数据被清除 localStorage的使用详解
Sep 16 Javascript
使用JQuery自动完成插件Auto Complete详解
Jun 18 jQuery
解决vue cli使用typescript后打包巨慢的问题
Sep 30 Javascript
vue项目中openlayers绘制行政区划
Dec 24 #Vue.js
Vue+penlayers实现多边形绘制及展示
Dec 24 #Vue.js
Vue使用鼠标在Canvas上绘制矩形
Dec 24 #Vue.js
vue绑定class的三种方法
Dec 24 #Vue.js
全面解析Vue中的$nextTick
Dec 24 #Vue.js
vue实现登录、注册、退出、跳转等功能
Dec 23 #Vue.js
js实现随机点名功能
Dec 23 #Javascript
You might like
浅析PHP微信支付通知的处理方式
2014/05/25 PHP
PHP中基本HTTP认证技巧分析
2015/03/16 PHP
WordPress中Gravatar头像缓存到本地及相关优化的技巧
2015/12/19 PHP
理解JavaScript的caller,callee,call,apply
2009/04/28 Javascript
js 刷新页面的代码小结 推荐
2010/04/02 Javascript
JS的replace方法详细介绍
2012/11/09 Javascript
JQuery的自定义事件代码,触发,绑定简单实例
2013/08/01 Javascript
js怎么判断flash swf文件是否加载完毕
2014/08/14 Javascript
基于ajax实现文件上传并显示进度条
2015/08/03 Javascript
js判断当前页面用什么浏览器打开的方法
2016/01/06 Javascript
基于JavaScript实现图片点击弹出窗口而不是保存
2016/02/06 Javascript
jQuery判断浏览器并动态调整select宽度的方法
2016/03/02 Javascript
jquery使用on绑定a标签无效 只能用live解决
2016/06/02 Javascript
Vue.js每天必学之Class与样式绑定
2016/09/05 Javascript
jQuery图片加载显示loading效果
2016/11/04 Javascript
JavaScript中setTimeout的那些事儿
2016/11/14 Javascript
详解node如何让一个端口同时支持https与http
2017/07/04 Javascript
微信小程序实现获取准确的腾讯定位地址功能示例
2019/03/27 Javascript
微信小程序制作扭蛋机代码实例
2019/09/24 Javascript
vue 实现走马灯效果
2019/10/28 Javascript
vue中对象数组去重的实现
2020/02/06 Javascript
[48:41]VP vs VG Supermajor小组赛 B组胜者组决赛 BO3 第二场 6.2
2018/06/03 DOTA
浅谈python中set使用
2016/06/30 Python
PyCharm设置每行最大长度限制的方法
2019/01/16 Python
Python学习笔记之列表推导式实例分析
2019/08/13 Python
详解Python中字符串前“b”,“r”,“u”,“f”的作用
2019/12/18 Python
PyTorch实现更新部分网络,其他不更新
2019/12/31 Python
使用Django实现把两个模型类的数据聚合在一起
2020/03/28 Python
Keras loss函数剖析
2020/07/06 Python
CSS3实现简易版的刮刮乐效果
2016/09/27 HTML / CSS
canvas实现滑动验证的实现示例
2020/08/11 HTML / CSS
求网格中的黑点分布
2013/11/06 面试题
赡养老人协议书
2014/04/21 职场文书
共产党员岗位承诺书
2014/05/29 职场文书
SONY600GR,国产收音机厂商永远的痛
2022/04/05 无线电
MySQL创建管理RANGE分区
2022/04/13 MySQL