关于js的三种使用方式(行内js、内部js、外部js)的程序代码


Posted in Javascript onMay 05, 2018

本文讲述了js的三种使用方式(行内js、内部js、外部js)的实例代码,感兴趣的小伙伴们可以参考一下,具体如下:

1、行内js:js不单独写出

<!DOCTYPE html> 
<html lang="en"> 
<head> 
 <meta charset="UTF-8"> 
 <title>js使用方式1:行内js</title> 
</head> 
<body> 
<input type="button" value="点击有惊喜" onclick="javascript:alert('哈哈哈哈')"> 
<!--onclick:点击触发一个事件,alert:弹出一个对话框--> 
</body> 
</html>

2、内部js:script里的程序整个页面都可以用

<!DOCTYPE html> 
<html lang="en"> 
<head> 
 <meta charset="UTF-8"> 
 <title>js使用方式2:内部js</title> 
 <script type="text/javascript"> 
  //声明一个函数(整个文档都可以使用) 
  function surprise() { 
   alert('恭喜你中了一百万')/*弹出框*/ 
  } 
 </script> 
</head> 
<body> 
<input type="button" value="点击有惊喜" onclick="surprise()"><!--调用函数--> 
<input type="button" value="点击" onclick="surprise()"> 
</body> 
</html>

3、外部js:很多html页面都可以调用设定的js页面

<!DOCTYPE html> 
<html lang="en"> 
<head> 
 <meta charset="UTF-8"> 
 <title>js使用方式3:外部js</title> 
 <!--很多html页面都可以调用js4.js页面--> 
 <script src="../../js/js4.js" type="text/javascript" charset="utf-8"> 
 </script> 
</head> 
<body> 
<input type="button" value="点击" onclick="test()"> 
</body> 
</html>

以上所述是小编给大家介绍的js的三种使用方式(行内js、内部js、外部js)的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
15个款优秀的 jQuery 图片特效插件推荐
Nov 21 Javascript
poshytip 基于jquery的 插件 主要用于显示微博人的图像和鼠标提示等
Oct 12 Javascript
Node.js中使用Buffer编码、解码二进制数据详解
Aug 16 Javascript
javascript实现的字符串与十六进制表示字符串相互转换方法
Jul 17 Javascript
详解vue-cli开发环境跨域问题解决方案
Jun 06 Javascript
简单谈谈关于 npm 5.0 的新坑
Jun 08 Javascript
cropper js基于vue的图片裁剪上传功能的实现代码
Mar 01 Javascript
jQuery实现的页面详情展开收起功能示例
Jun 11 jQuery
jQuery实现ajax的嵌套请求案例分析
Feb 16 jQuery
微信小程序如何修改本地缓存key中单个数据的详解
Apr 26 Javascript
React传值 组件传值 之间的关系详解
Aug 26 Javascript
js图数据结构处理 迪杰斯特拉算法代码实例
Sep 11 Javascript
js动态引入的四种方法
May 05 #Javascript
关于HTML5的data-*自定义属性的总结
May 05 #Javascript
深入浅析Vue.js计算属性和侦听器
May 05 #Javascript
详解js跨域请求的两种方式,支持post请求
May 05 #Javascript
vue 注册组件的使用详解
May 05 #Javascript
Vue三层嵌套路由的示例代码
May 05 #Javascript
动态加载JavaScript文件的3种方式
May 05 #Javascript
You might like
php遍历类中包含的所有元素的方法
2015/05/12 PHP
php 防止表单重复提交两种实现方法
2016/11/03 PHP
Prototype1.5 rc2版指南最后一篇之Position
2007/01/10 Javascript
JavaScript 学习小结(适合新手参考)
2009/07/30 Javascript
extjs 学习笔记 四 带分页的grid
2009/10/20 Javascript
游览器中javascript的执行过程(图文)
2012/05/20 Javascript
删除select中所有option选项jquery代码
2013/08/12 Javascript
js实现div的切换特效上一个下一个
2014/02/11 Javascript
JavaScript中Boolean对象的属性解析
2015/10/21 Javascript
JS调用打印机功能简单示例
2016/11/28 Javascript
ReactNative踩坑之配置调试端口的解决方法
2017/07/28 Javascript
JQuery的加载和选择器用法简单示例
2019/05/13 jQuery
JS数组降维的实现Array.prototype.concat.apply([], arr)
2020/04/28 Javascript
JavaScript进阶(一)变量声明提升实例分析
2020/05/09 Javascript
JS删除数组指定值常用方法详解
2020/06/04 Javascript
Vue实现点击箭头上下移动效果
2020/06/11 Javascript
js实现html滑动图片拼图验证
2020/06/24 Javascript
Openlayers学习之加载鹰眼控件
2020/09/28 Javascript
python抓取豆瓣图片并自动保存示例学习
2014/01/10 Python
linux 下实现python多版本安装实践
2014/11/18 Python
python使用xlrd模块读写Excel文件的方法
2015/05/06 Python
python通过openpyxl生成Excel文件的方法
2015/05/12 Python
详解在Python程序中自定义异常的方法
2015/10/16 Python
Python3操作SQL Server数据库(实例讲解)
2017/10/21 Python
基于python 处理中文路径的终极解决方法
2018/04/12 Python
python3.6.3+opencv3.3.0实现动态人脸捕获
2018/05/25 Python
Python动态导入模块的方法实例分析
2018/06/28 Python
Django 接收Post请求数据,并保存到数据库的实现方法
2019/07/12 Python
python 批量添加的button 使用同一点击事件的方法
2019/07/17 Python
django多对多表的创建,级联删除及手动创建第三张表
2019/07/25 Python
Python操作列表常用方法实例小结【创建、遍历、统计、切片等】
2019/10/25 Python
python 字典套字典或列表的示例
2019/12/16 Python
在Windows上安装和配置 Jupyter Lab 作为桌面级应用程序教程
2020/04/22 Python
雏鹰争章活动总结
2014/05/09 职场文书
辞职信范文大全
2015/03/02 职场文书
无违反计划生育证明格式
2015/06/24 职场文书