首页 > 编程语言 >前端基础之JavaScript引入

前端基础之JavaScript引入

时间:2024-03-19 21:55:22浏览次数:18  
标签:外部 前端 JavaScript JS 注释 HTML 引入 js

一、什么是JavaScript

JavaScript是一门跨平台、面向对象的脚本语言(不需要编译,直接解释运行即可),来控制网页的行为,它能使网页可交互。

脚本语言:不需要编译,运行过程中由 js 解释器( js 引擎)逐行来进行解释并执行。

现在也可以基于 Node.js 技术进行服务器端编程

W3C标准:

网页主要由三部分构成

  • 结构:HTML
  • 表现:CSS
  • 行为:JavaScript

JavaScript和Java是完全不同的语言,不论是概念还是设计。但是在基础语法上类似。

JavaScript(简称:JS)在1995年由Brendan Eich发明,并于1997年成为一部ECMA标准。

ECMAScript 6(ES6)是最新的JavaScript版本(发布于2015年)

ECMAscript和JavaScript的关系:前者是后者的规格,后者是前者的实现

JS版本:

  • 主要还是用的5.1和6.0

总结:

  • JS是由ECMAScript、DOM、BOM组成
  • JS是运行在浏览器脚本的语言

二、JavaScript的作用

1、表单动态校验(密码强度检测) ( JS 产生最初的目的 )
2、网页特效
3、服务端开发(Node.js)
4、桌面程序(Electron)
5、App(Cordova)
6、控制硬件-物联网(Ruff)
7、游戏开发(cocos2d-js)

三、注释语法

// 单行注释

/*
多行注释
多行注释
多行注释
*/

四、JavaScript的引入方式

(1)方式一

内部脚本:将JS代码定义在HTML页面中

在HTML中,JavaScript代码必须位于标签之间

 <script>
        /*弹出警告框*/
        alert("hello js");
</script>

提示:

  • 在HTML文档中可以在任意地方,放置任意数量的<script>
  • 一般把脚本置于元素的底部,可改善显示速度,因为脚本执行会拖慢显示

(2)方式二

外部标签:将JS代码定义在外部JS文件中,然后script标签src属性引入外部js代码

外部文件:demo.js

alert("hello js");

引入外部js文件:

<script src="../js/demo.js"></script>

注意:

外部文件不能包含<script>标签

# js语法结构
js是以分号座位语句的结束
但是如果你不写分号,问题也不大,也能够正常执行,但是他就相当于没有结束符

五、JavaScript语法结构

  • 区分大小写:与Java一样,变量名、函数名以及其他一切东西都是区分大小写的
  • 每行结尾的分号可有可无
  • 大括号表示代码块
if(count == 3){
   alter(count);
}

六、如何学习JS

(1)JS书写位置

  • pycharm提供的js文件
  • 浏览器提供的js环境(学习阶段推荐)

(2)JS学习路线

  • 变量
  • 数据类型
  • 流程控制
  • 函数
  • 对象
  • 内置方法/模块

标签:外部,前端,JavaScript,JS,注释,HTML,引入,js
From: https://www.cnblogs.com/xiao01/p/18084038

相关文章

  • 前端性能优化
    性能优化的目的是为了实现资源的快速加载和响应。性能优化前,需要先分析性能,目的是分析出包含页面渲染、网络传输和文件加载等时间指标,对该页面进行评估分析。找出影响性能的主要因素和瓶颈,对此给出性能优化解决方案。1.性能分析Chrome浏览器的Performance选项卡主要用于对页......
  • 关于前端的学习2
    目录前言:1.标签的进阶:1.1单标签:功能标签1.2双标签:内容标签1.3元标签(MetaTags):1.3.1标题(Title):1.3.2描述(Description):1.3.3关键词(Keywords):1.3.4其他元标签:1.4链接标签:1.4.1锚文本(AnchorText):1.4.1Nofollow属性:1.5图片标签:1.5.1Alt属性:1.5.1Title属性:1.6结构......
  • 前端基础之CSS基本属性
    一、长度和宽度行内标签无法设置长宽,就算你写了,也不会生效<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</title><style>p{background-color:red;height:......
  • 前端基础之CSS浮动和定位方式
    一、浮动(1)概述浮动是所有网站页面布局必备的可以将块儿级标签浮动起来脱离正常的文档流。浮动是多个块儿级标签可以在一行显示(全部飘在了空中)浮动的元素,没有块儿级一说,本身有多大浮起来之后也就只能占多大。只要涉及到页面的布局,一般都是用浮动提前规划好主要属性值为:l......
  • 前端面试题
    1、vue2和vue3的主要区别1、性能优化:Vue3对虚拟DOM进行了优化,例如使用了更高效的算法,缩减了代码量。此外,Vue3还利用Proxy代理优化了响应式系统,提高了性能。2、新特性:Vue3引入了CompositionAPI,是一种函数式API。CompositionAPI使得组合逻辑更加容易,能够更好地重用组件逻辑。......
  • 使用Selenium执行JavaScript脚本:探索Web自动化的新领域
    前言在我们使用selenium进行自动化测试的时候,selenium能够帮助我们实现元素定位和点击输入等操作,但是有的时候,我们会发现,即使我们的元素定位没有问题,元素也无法执行操作;也有部分情况是我们无法直接定位滚动条河时间控件来进行操作,这个时候,我们就需要借助JavaScript来解决问题。......
  • JavaScript笔记 01
    目录01js概述02js代码的基本使用03js变量的基本使用04变量的类型05数值类型06字符串类型07布尔类型08 使用typeof查看变量的类型09其他类型转换为字符串类型10其他数据类型转换为数值型11其他数据类型转换成布尔类型12小知识点01js概述前端的三......
  • 线程的引入以及进程和线程的区别
    线程的引入:在OS中引入线程,为了减少程序在并发执行时所付出的时空开销,使OS具有更好的并发性。进程的两个基本属性:进程是一个可拥有资源的独立单位;进程同时也是一个可独立调度和分派的基本单位。每个进程在系统中均有唯一的PCB,系统可根据PCB来感知进程的存在,也可以根据PCB中的信......
  • 前端基础之CSS基础
    一、什么是cssCSS(CascadingStyleSheets的缩写),翻译为“层叠样式表”或者“级联样式表”,简称样式表。主要用来给HTML网页设置外观或者样式(HTML网页中的文字大小、颜色、字体、网页的背景颜色、背景图片等)。通俗来说就是给HTML标签添加样式的,让它变得更加好看二、注释语法......
  • 前端基础之CSS选择器
    一、什么是选择器选择器是指通过一定的语法规则选取到对应的HTML标记,然后给这个对应的HTML标记设置样式二、选择器的分类CSS中提供了多种不同类型的选择器,例如基本选择器、组合选择器、伪类选择器、伪元素选择器等等。1、基本选择器(1)概览在CSS中,选择器用于选取HTML文档中的......