1 JavaScript的引入方式

JavaScript, 是一门能够运行在浏览器上的脚本语言. 简称JS. 首先, Javascript这个名字的由来就很有意思, 不少人认为Javascript和Java貌似很像. 容易想象成Java的脚本. 但其实不然, 两者之间没有任何关系. 纯粹是商业碰瓷.

那么既然JS是可以运行在浏览器上的脚本. 并且, 我们知道本质上, 浏览器是执行HTML程序的. 那么如何在HTML中引入JS呢?

方案一, 直接在<script>标签中引入编写js代码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JavaScript的引入方式</title>
</head>
<body>
<!-- JavaScript 在html文件中的引入方式1 -->
<script>alert('我最帅~~~')</script>
</body>
</html>

方案二, 将js代码写在js文件中, 然后通过<script>标签的src属性进行引入

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JavaScript的引入方式</title>
</head>
<body>
<!-- JavaScript 在html文件中的引入方式2 -->
<script src = "测试文件.js"></script>
</body>
</html>

两种方式运行出的效果是一致的. 但是需要各位注意一点, HTML程序在执行的时候是从上到下进行渲染的.

那么如果把脚本放在下面和放在上面是有一些不同的.

1 JavaScript的引入方式的更多相关文章

  1. JavaScript 基础(一) - JavaScript的引入方式,JavaScript 变量命名规则,JS 的五种基本数据类型,ECMAScript 算数运算符,逻辑运算符

    JavaScript的引入方式 直接编写 <!DOCTYPE html> <html lang="en"> <head> <meta ch ...

  2. web前端(13)—— 了解JavaScript,JavaScript的引入方式

    从本篇博文开始,将进入web前端方便最关键最重要的部分——javascript,学到后面你就知道它真的太重要了 什么是JavaScript JavaScript一种直译式的脚本语言,是一种动态类型.弱 ...

  3. JavaScript文件引入方式区别

    1.JavaScript文件引入方式 (1)正常引入 <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js&quo ...

  4. JavaScript的引入方式

    外部JS文件 deno.js alert('你好!JavaScript'); JS引入方式.html <!--方式一:内部脚本--> <!--标签不能自闭和--> <sc ...

  5. 【JavaScript的引入方式】

    javascript:   是基于对象和事件驱动的客户端脚本[组成] Bom:浏览对象模型(与浏览器交互的方法和接口) Dom:文档对象模型(处理网页内容的方法和接口) ecma:核心(描述了js的语 ...

  6. [javascript svg fill stroke stroke-width circle 属性讲解] svg fill stroke stroke-width circle 属性 绘制圆形及引入方式讲解

    <!DOCTYPE html> <html lang='zh-cn'> <head> <title>Insert you title</title ...

  7. JavaScript发展史,与JScript差别,引入方式,数据类型,命名规范,命名推荐,解决命名冲突

    文件夹: 1.JavaScript发展史 2.JavaScript与JScript差别 3.JavaScript引入方式 4.JavaScript基本数据类型及布尔值 5.JavaScript命名规范 ...

  8. JavaScript 引入方式 语言规范 语言基础 数据类型 常用方法 数组 if_else 比较运算符 for while 函数 函数的全局变量和局部变量 {Javascript学习}

    Javascript学习 JavaScript概述 ECMAScript和JavaScript的关系 1996年11月,JavaScript的创造者--Netscape公司,决定将JavaScript ...

  9. 【JavaScript】内部与外部引入方式

    1.内部引入方式: script的type属性默认为"text/javascript",可以不写 <script type="text/javascript&quo ...

  10. Python--前端基础之JavaScript(JS的引入方式,JS的变量、常量和标识符,JS的数据类型,运算符,流程控制,JavaScript的对象)

    JavaScript介绍 JavaScript是运行在浏览器端的脚步语言,JavaScript主要解决的是前端与用户交互的问题,包括使用交互与数据交互. JavaScript是浏览器解释执行的,前端脚 ...

随机推荐

  1. windows 上 ffmpeg 库的安装

    真复杂啊 安装 ffmpeg 库有两种途径,一种是自己下载源码再去编译,另一种是使用 vcpkg 自动安装 一般情况下,第二种是最简单方便的,但是如果你需要使用 ffmpeg 的特定历史版本,那就有点 ...

  2. 前端树形Tree数据结构使用-🤸🏻‍♂️各种姿势总结

    01.树形结构数据 前端开发中会经常用到树形结构数据,如多级菜单.商品的多级分类等.数据库的设计和存储都是扁平结构,就会用到各种Tree树结构的转换操作,本文就尝试全面总结一下. 如下示例数据,关键字 ...

  3. Vulnhub内网渗透DC-6靶场通关

    个人博客 xzajyjs.cn IP DC-6: 192.168.168.4 Kali: 192.168.168.5 信息搜集 arp-scan -l # nmap -sn 192.168.168.0 ...

  4. File.delete()和Files.delete(Path path)的区别

    文件删除时可以选择File.delete()和Files.delete(Path path),这两个方法到底有什么区别呢? //删除暂存的pdfFile file =new File(pdfFilen ...

  5. SwitUI初次体验

    序言 开年的第一篇文章,今天分享的是SwiftUI,SwiftUI出来好几年,之前一直没学习,所以现在才开始:如果大家还留在 iOS 开发,这们语言也是一个趋势: 目前待业中.... 不得不说已逝的2 ...

  6. JavaScript之原生ajax && jQuery之ajax

        ajax提供了异步访问服务器的方法,使页面无须刷新就可以更改页面内容,在实际情况中使用原生的情况较少但是原理需要掌握,一般都是使用jquey更轻量级的实现ajax但是原理是共同的.     原 ...

  7. 【Azure Logic App】使用Outlook.com发送邮件遇到429报错

    问题描述 在Logic App中使用 Outlook.com组件发送邮件,遇见了outlook connection报429的错误 {"error":{"code&quo ...

  8. C#/.NET/.NET Core优秀项目和框架2024年2月简报

    前言 公众号每月定期推广和分享的C#/.NET/.NET Core优秀项目和框架(每周至少会推荐两个优秀的项目和框架当然节假日除外),公众号推文中有项目和框架的介绍.功能特点.使用方式以及部分功能截图 ...

  9. 学习ASP.NET MVC 编程系列文章目录

    学习ASP.NET MVC(一)--我的第一个ASP.NET MVC应用程序 学习ASP.NET MVC(二)--我的第一个ASP.NET MVC 控制器 学习ASP.NET MVC(三)--我的第一 ...

  10. yarn install --offline 离线安装 回头试试 npm install ./package.tgz

    yarn install --offline npm pack npm install ./package.tgz 尝试了 npm-pack-all --dev-deps 也不行,太慢,等了20分钟 ...