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…

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

相关文章

  • Boostrap中栅格布局的实现

    Boostrap中栅格布局的实现

    这篇文章主要为大家详细解析了Boostrap 栅格布局,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2017-01-01
  • js实现继承的方法及优缺点总结

    js实现继承的方法及优缺点总结

    这篇文章主要给大家介绍了关于js实现继承的方法及优缺点的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用JavaScript具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2019-05-05
  • JavaScript实现网页上的浮动广告的简单方法

    JavaScript实现网页上的浮动广告的简单方法

    JavaScript实现网页上的浮动广告的简单方法,需要的朋友可以参考一下
    2013-06-06
  • 解析从小程序开发者工具源码看原理实现

    解析从小程序开发者工具源码看原理实现

    小程序的架构设计与web技术还是有一定的差别,其吸取了web技术的一些优势,同时也摒弃web技术中体验等不好的地方。下面通过问题的形式来说说小程序架构中的一些设计点
    2021-06-06
  • 如何计算Web动画帧率FPS

    如何计算Web动画帧率FPS

    我们知道,动画其实是由一帧一帧的图像构成的。有Web动画那么就会存在该动画在播放运行时的帧率。而帧率在不同设备不同情况下又是不一样的。有的时候,一些复杂或者重要动画,需要实时监控它们的帧率,从而更好的优化它们,本文就是介绍Web动画帧率(FPS)计算方法。
    2021-05-05
  • JavaScript正则验证密码强弱度的实现方法

    JavaScript正则验证密码强弱度的实现方法

    这篇文章主要介绍了JavaScript正则验证密码强弱度的实现方法,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2021-05-05
  • js event事件的传递与冒泡处理

    js event事件的传递与冒泡处理

    与Netscape相反,IE中的事件传递方向是从事情发生的对象开始,然后依次由该对象向所在的父节点传递。
    2009-12-12
  • tangram框架响应式加载图片方法

    tangram框架响应式加载图片方法

    这篇文章主要介绍了使用tangram框架响应式加载图片的方法,大家可以参考使用
    2013-11-11
  • JavaScript实现网页五子棋小游戏

    JavaScript实现网页五子棋小游戏

    这篇文章主要为大家详细介绍了JavaScript实现网页五子棋小游戏,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-06-06
  • js中的数组Array定义与sort方法使用示例

    js中的数组Array定义与sort方法使用示例

    Array定义与sort方法在使用过程中还是比较常见的,下面为大家介绍下Array的定义及sort方法使用示例
    2013-08-08

最新评论