javascript内嵌式与外链式的基本应用方式

更新时间：2021年12月04日 09:34:41 作者：「已注销」

这篇文章主要介绍了javascript内嵌式与外链式的基本应用方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教

javascript内嵌式与外链式基本应用

js语言可以完全放在html语言中

但视情况而定可以分为内嵌式以及外链式

当js代码较少，可以直接使用内嵌式通过<script></script>标签以及相关属性引入javascript

<!DOCTYPE html>
<html>
<script>
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph.</p>");
</script>
<body>
 
</body>
</html>

但是在大型工程以及javascript代码较多时就需要使用外链式了

使用外链式时需要先新建一个.js文件

<!DOCTYPE html>
<html>
<script type="text/javascript" src="1245.js">
</script>
<body>
 
</body>
</html>

将需要编写的javascript代码放在1245.js的文件中

JavaScript的三种书写方式：行内式、内嵌式、外链式

1、行内式

在html标签的属性内,通过行为触发执行.（几乎不用）

在这里插入图片描述

2、内嵌式

在html文件内使用script标签包裹起来，页面打开自动执行。（使用方便，但是大篇幅的JS代码千万不要用。）

在这里插入图片描述

3、外链式

写在独立的js文件内，在html文件中使用script标签的src属性引入，页面打开自动执行。（推荐使用，因为有各种优化方法）

在这里插入图片描述

注：行内真的很少用，几乎不用。内嵌和外链不能共用一个script标签。外链的script标签，原则上来说可以放在任何位置。外链的script属性为src，不是href，不是href，不是href…

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

Javascript 自适应高度的Tab选项卡
选项卡的原理其实比较简单，就是设置2种状态，选中和未选中的2中不同CSS状态，因此也有直接不用JS之用css就能实现的效果
2011-04-04
JS数组及对象遍历方法代码汇总
这篇文章主要介绍了JS数组及对象遍历方法代码汇总,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
2020-06-06
Javascript中类式继承和原型式继承的实现方法和区别之处
其它的面向对象程序设计语言都是通过关键字来解决继承的问题。但是javascript中并没有定义这种实现的机制。接下来通过本文给大家介绍Javascript中类式继承和原型式继承的实现方法和区别,需要的朋友可以参考下
2017-04-04
webpack+vue2构建vue项目骨架的方法
本篇文章主要介绍了webpack+vue2构建vue项目骨架的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2018-01-01
mpvue微信小程序多列选择器用法之省份城市选择的实现
这篇文章主要给大家介绍了关于mpvue微信小程序多列选择器用法之省份城市选择实现的相关资料，文中通过示例代码以及图文介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面来一起学习学习吧
2019-03-03
微信小程序自定义底部、顶部、中间、左边及右边弹窗
这篇文章主要给大家介绍了关于微信小程序自定义底部、顶部、中间、左边及右边弹窗的相关资料,弹窗是小程序中非常重要的一种互动方式,比如用户注册时错误提示、优惠券领取提示、签到成功提示等等,需要的朋友可以参考下
2023-11-11
js 操作符实例代码
一个单例对象,承载大多数常用的函数列表
2009-10-10
js 实现的可折叠留言板(附源码下载)
留言板想必大家都有见过吧，但是可以折叠的却不是很多，恰好本文提供一个比较不错的可折叠留言板，感兴趣的朋友可以学习下
2014-07-07
ES6扩展运算符的用途实例详解
这篇文章主要介绍了ES6扩展运算符的用途 ,非常不错，具有参考借鉴价值，需要的朋友可以参考下
2017-08-08
分享一个原生的JavaScript拖动方法
本文给大家分享的是基于JavaScript的setCapture方法实现的拖动效果，非常的简单实用，有需要的小伙伴可以参考下
2016-09-09