关于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 相关文章推荐
驱动事件的addEvent.js代码
Mar 27 Javascript
jQuery 动画基础教程
Dec 25 Javascript
javascript中的prototype属性实例分析说明
Aug 09 Javascript
Jquery:ajax实现翻页无刷新功能代码
Aug 05 Javascript
Javascript中的arguments与重载介绍
Mar 15 Javascript
简单实现js上传文件功能
Aug 21 Javascript
详解如何用webpack4从零开始构建react开发环境
Jan 27 Javascript
微信小程序的tab选项卡的实现效果
May 15 Javascript
layui: layer.open加载窗体时出现遮罩层的解决方法
Sep 26 Javascript
jQuery实现获取多选框的值示例
Feb 07 jQuery
viewer.js一个强大的基于jQuery的图像查看插件(支持旋转、缩放)
Apr 01 jQuery
使用原生javascript开发计算器实例代码
Feb 21 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』PHP截断函数mb_substr()使用介绍
2013/04/22 PHP
yii框架配置默认controller和action示例
2014/04/30 PHP
php实现模拟post请求用法实例
2015/07/11 PHP
浅析Yii2中GridView常见操作
2016/04/22 PHP
PHP判断是否是微信打开还是浏览器打开的方法
2019/02/27 PHP
CSS心形加载的动画源码的实现
2021/03/09 HTML / CSS
js 创建书签小工具之理论
2011/02/25 Javascript
关于innerHTML后丢失动态绑定的EVENT问题解决方法
2013/05/19 Javascript
兼容IE和FF的图片上传前预览js代码
2013/05/28 Javascript
通过pjax实现无刷新翻页(兼容新版jquery)
2014/01/31 Javascript
javascript数组克隆简单实现方法
2015/12/16 Javascript
JS判断指定dom元素是否在屏幕内的方法实例
2017/01/23 Javascript
利用策略模式与装饰模式扩展JavaScript表单验证功能
2017/02/14 Javascript
Vue.js在使用中的一些注意知识点
2017/04/29 Javascript
JavaScript循环_动力节点Java学院整理
2017/06/28 Javascript
基于 Vue.js 之 iView UI 框架非工程化实践记录(推荐)
2017/11/21 Javascript
Vue表单及表单绑定方法
2018/09/04 Javascript
vue 组件内获取actions的response方式
2019/11/08 Javascript
用Angular实现一个扫雷的游戏示例
2020/05/15 Javascript
vue中路由跳转不计入history的操作
2020/09/21 Javascript
基于Python的身份证号码自动生成程序
2014/08/15 Python
在Python中使用dict和set方法的教程
2015/04/27 Python
利用python爬取斗鱼app中照片方法实例
2017/12/03 Python
python pandas消除空值和空格以及 Nan数据替换方法
2018/10/30 Python
Python对接六大主流数据库(只需三步)
2019/07/31 Python
Python logging日志库空间不足问题解决
2020/09/14 Python
法国大使拉杆箱官网:DELSEY Paris
2018/03/20 全球购物
蔻驰西班牙官网:COACH西班牙
2019/01/16 全球购物
俄罗斯第一家篮球店:StreetBall
2020/07/30 全球购物
laravel使用redis队列实例讲解
2021/03/23 PHP
总经理秘书工作职责
2013/12/26 职场文书
2014高中生入党思想汇报范文
2014/09/13 职场文书
瘦西湖导游词
2015/02/03 职场文书
拿破仑传读书笔记
2015/07/01 职场文书
《水浒传》读后感3篇(范文)
2019/09/19 职场文书
Java 超详细讲解十大排序算法面试无忧
2022/04/08 Java/Android