当前位置: 首页 > news >正文

10 JS01——初识JS

目标:
1、初识JavaScript
2、JavaScript注释
3、JavaScript输入输出语句

一、初识JavaScript

1、JavaScript是什么

· JavaScript是世界上最流行的语言之一,是一种运行在客户端的脚本语言(Script是脚本的意思)
· 脚本语言:不需要编译,运行过程中由js解释器(js引擎)逐行来进行解释并执行
· 现在也可以基于Nodeis技术进行服务器端编程

2、JavaScript的作用

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

3、HTM L/CSS/JS的关系

HTML/CSS 标记语言–描述类语言
· HTML决定网页结构和内容(决定看到什么),相当于人的身体
· CSS决定网页呈现给用户的模样(决定好不好看),相当于给人穿衣服、化妆
JS 脚本语言–编程类语言
· 实现业务逻辑和页面控制(决定功能),相当于人的各种动作

4、浏览器执行JS简介

浏览器分成两部分:渲染引擎和JS引擎
· 渲染引擎:用来解析HTML与CSS,俗称内核,比如chrome浏览器的blink,老版本的webkit
· JS引擎:也称为JS解释器。用来读取网页中的JavaScript代码,对其处理后运行,比如chrome浏览器的V8

浏览器本身并不会执行JS代码,而是通过内置JavaScript引擎(解释器) 来执行 JS 代码 。
JS 引擎执行代码时逐行解释每一句源码(转换为机器语言),然后由计算机去执行,
所以 JavaScript 语言归为脚本语言,会逐行解释执行。

5、JS组成

请添加图片描述

(1)ECMAScript

ECMAScript是由ECMA国际(原欧洲计算机制造商协会)进行标准化的一门编程语言,这种语言在万维网上应用广泛,它往往被称为JavaScript或JScript,但实际上后两者是ECMAScript语言的实现和扩展。
在这里插入图片描述
ECMAScript:ECMAScript规定了JS的编程语法和基础核心知识,是所有浏览器厂商共同遵守的一套JS语法工业标准。

(2)DOM-文档对象模型

文档对象模型(DocumentObjectModel,简称DOM),是W3C组织推荐的处理可扩展标记语言的标准编程接口.通过DOM提供的接口可以对页面上的各种元素进行操作(大小位置、颜色等)。

(3)BOM-浏览器对象模型

BOM(Browser ObjectModel,简称BOM)是指浏览器对象模型,它提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。通过BOM可以操作浏览器窗口,比如弹出框、控制浏览器跳转、获取分辨率等。

6、JS三种书写位置

(1)行内式

<input type = "button" value = "点我试试" onclick = "alert('Hello World')"/>

· 可以将单行或少量JS代码写在HTML标签的事件属性中(以on开头的属性),如:onclick
· 注意单双引号的使用:在HTML中我们推荐使用双引号,JS中我们推荐使用单引号
· 可读性差,在html中编写JS大量代码时,不方便阅读;
· 引号易错,引号多层嵌套匹配时,非常容易弄混;
· 特殊情况下使用

(2)内嵌JS

<script>alert('Hello World!');
</script>

· 可以将多行JS代码写到script标签中
· 内嵌JS是学习时常用的方式

(3)外部JS文件

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

· 利于HTML页面代码结构化,把大段JS代码独立到HTML页面之外,既美观,也方便文件级别的复用
· 引用外部JS文件的script标签中间不可以写代码
· 适合于JS代码量比较大的情况

二、JavaScript注释

(1)单行注释

//单行注释

快捷键:ctrl+/

(2)多行注释

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

默认快捷键:shift+alt+a
vscode中修改多行注释

三、JavaScript输入输出语句

在这里插入图片描述在这里插入图片描述

相关文章:

10 JS01——初识JS

目标&#xff1a; 1、初识JavaScript 2、JavaScript注释 3、JavaScript输入输出语句 一、初识JavaScript 1、JavaScript是什么 JavaScript是世界上最流行的语言之一&#xff0c;是一种运行在客户端的脚本语言(Script是脚本的意思) 脚本语言:不需要编译&#xff0c;运行过程…...

【软考备考-综合知识】安全性、可靠性与系统性能评测基础知识

计算机的安全性 安全等级 计算机系统中的三类安全性是指技术安全性、管理安全性和政策法律安全性。 信息安全五要素 机密性&#xff1a;全包信息不暴露给未授权的实体或进程。 完整性&#xff1a;只有得到允许的人才能够修改数据&#xff0c;并能够判别出数据是否已被篡改。…...

匆忙之间难免疏忽,写代码更加如此

一个方法包含了多个知识点的合计&#xff0c;合计起来用。实战开发特点1&#xff1b; 基础知识点不牢固&#xff0c;您必定就会感觉寸步难行啊 public class AddJiChuShu{int a 1;int b 2;int c 0;int d 0;string str "";string str2 "张三";//mothe…...

低代码(七)低代码平台后端技术选型2.0

JWT 登录token Json web token (JWT), 是为了在网络应用环境间传递声明而执行的一种基于JSON的开放标准&#xff08;(RFC 7519).该token被设计为紧凑且安全的&#xff0c;特别适用于分布式站点的单点登录&#xff08;SSO&#xff09;场景。JWT的声明一般被用来在身份提供者和服…...

UDS介绍

首先要有网络网络七层的概念&#xff1a; 学习链接&#xff1a; 七层网络模型-CSDN博客 UDS网络层/TP层&#xff08;ISO 15765-2&#xff09;的解读 - 知乎 (zhihu.com) 概念&#xff1a; UDS&#xff08;Unified Diagnostic Services&#xff0c;统一的诊断服务。 标准名是《…...

ASP.NET Core MVC 从入门到精通之初窥门径

随着技术的发展&#xff0c;ASP.NET Core MVC也推出了好长时间&#xff0c;经过不断的版本更新迭代&#xff0c;已经越来越完善&#xff0c;本系列文章主要讲解ASP.NET Core MVC开发B/S系统过程中所涉及到的相关内容&#xff0c;适用于初学者&#xff0c;在校毕业生&#xff0c…...

英码科技智慧环卫:构建宜居城市新篇章

随着城市化进程的加快&#xff0c;城市环境卫生问题日益凸显。如何提高城市环境卫生管理水平&#xff0c;提升城市品质&#xff0c;成为了各级政府和社会各界关注的焦点。智慧环卫作为一种结合现代信息技术的环境卫生管理方式&#xff0c;正在逐渐成为解决城市环境卫生问题的有…...

在Spring Boot微服务使用HashOperations操作Redis Hash哈希散列

记录&#xff1a;403 场景&#xff1a;在Spring Boot微服务使用RedisTemplate的HashOperations操作Redis Hash哈希散列。 版本&#xff1a;JDK 1.8,Spring Boot 2.6.3,redis-6.2.5 1.微服务中Redis配置信息 1.1在application.yml中Redis配置信息 spring:redis:host: 192.1…...

innobackupex备份mysql产生returned OS error 124

解决使用innobackupex备份mysql产生returned OS error 124 xtrabackup 报错Too many open files 故障处理 一、背景 客户反馈数据库备份失败。 二、环境描述 [rootmes-node1 ~]# mysql -V mysql Ver 14.14 Distrib 5.7.24, for Linux (x86_64) using EditLine wrapper [root…...

明明有index.jsp文件访问的时候却显示404

重建一下项目...

人工智能前沿——「全域全知全能」人类新宇宙ChatGPT

&#x1f680;&#x1f680;&#x1f680;OpenAI聊天机器人ChatGPT——「全域全知全能」人类全宇宙大爆炸&#xff01;&#xff01;&#x1f525;&#x1f525;&#x1f525; 一、什么是ChatGPT?&#x1f340;&#x1f340; ChatGPT是生成型预训练变换模型&#xff08;Chat G…...

eslint-plugin-import - import/order

eslint-plugin-import是什么&#xff1f; 该插件目的在于支持ES6以上的导入/导出语法&#xff0c;并防止文件路径和导入名称拼写错误的问题。 import/order是什么&#xff1f; 按照约定的规则对引入的模块进行排序。 import/order常用规则介绍 groups 约定引入模块顺序的…...

selenium知识点大全

selenium知识点大全 在使用selenium之前必须先配置浏览器对应版本的webdriver。 1. 初始化浏览器对象 from selenium.webdriver import Chrome# 创建浏览器对象&#xff0c;并且打开一个空的页面 browser Chrome()# 关闭浏览器 browser.close()2. 访问指定网页 from selen…...

Biotin-PEG-SH生物素-聚乙二醇-巯基结构式;SH-PEG-Biotin

Biotin-PEG-SH 生物素-聚乙二醇-巯基 中文名称&#xff1a;生物素-聚乙二醇-巯基 英文名称&#xff1a;Biotin-PEG-SH Biotin-PEG-Thiol 性状&#xff1a;粘稠液体或者固体粉末&#xff0c;取决于分子量 溶剂&#xff1a;溶于水和DCM、DMF等大部分有机溶剂 分子式&#x…...

【防止恶意用户注册】-- 手机在网状态 API 的防欺诈应用解析

简介 手机在网状态 API 支持传入手机号码&#xff0c;查询手机号在网状态&#xff0c;返回在网、在网不可用、不在网&#xff08;销号/未启用/停机&#xff09;等多种状态&#xff0c;查询手机号在网状态之后&#xff0c;可以根据具体的业务需求来进行不同的处理。 本文主要介…...

Python json 数据提取 jsonpath 详解

一、JsonPath JsonPath 是一种信息抽取类库&#xff0c;是从JSON文档中抽取指定信息的工具&#xff0c;提供多种语言实现版本&#xff0c;包括&#xff1a;Javascript, Python&#xff0c; PHP 和 Java。也就是独立的可以配合多种语言进行匹配的目标值的一种类库&#xff0c;和…...

TCP和UDP的区别以及应用场景

区别 首先UDP协议非常简单&#xff0c;头部只有8个字节&#xff1a; 校验和为了提供可靠的UDP首部和数据而设计&#xff0c;防止收到在网络传输中受损的UDP包。 再对比下TCP协议&#xff1a; 传输层有两个传输协议分别是 TCP 和 UDP&#xff0c;在内核中是两个完全独立的软件…...

高铁轮毂表面缺陷的<视觉显著性>超像素图像检测方法

内容:提出一种基于视觉显著性注意机制的超像素自适应检测方法&#xff1b; 设计视觉显著性注意机制滤波器用于粗略定位出缺陷空间范围&#xff0c;结合超像素分块图像分割方法消除光照不均匀引起的噪声干扰&#xff0c;有效地完成缺陷区域的边界分割和实时特征提取&…...

纺织工业库房如何有效防潮?恒温恒湿真的有效吗?

纺织工业库房中的设备或存放的货物对温度或湿度的变化又非常敏感&#xff0c;温度或湿度的波动可能会产生一些问题。 针对库房环境温湿度的监测&#xff0c;若采用人工检测的方式&#xff0c;很难管控精准且工作效率低&#xff1b;其次&#xff0c;人工综合成本高。那么该如何实…...

SDK之动态链接库开发—基本概念

动态链接库&#xff08;Dynamic Link Library&#xff0c;简称 DLL&#xff09;是一种在运行时加载的库&#xff0c;可用于在多个应用程序之间共享代码和数据。与静态链接库相比&#xff0c;动态链接库的主要优劣势如下&#xff1a; 优势&#xff1a; 空间效率更高&#xff0…...

应用升级/灾备测试时使用guarantee 闪回点迅速回退

1.场景 应用要升级,当升级失败时,数据库回退到升级前. 要测试系统,测试完成后,数据库要回退到测试前。 相对于RMAN恢复需要很长时间&#xff0c; 数据库闪回只需要几分钟。 2.技术实现 数据库设置 2个db_recovery参数 创建guarantee闪回点&#xff0c;不需要开启数据库闪回。…...

大话软工笔记—需求分析概述

需求分析&#xff0c;就是要对需求调研收集到的资料信息逐个地进行拆分、研究&#xff0c;从大量的不确定“需求”中确定出哪些需求最终要转换为确定的“功能需求”。 需求分析的作用非常重要&#xff0c;后续设计的依据主要来自于需求分析的成果&#xff0c;包括: 项目的目的…...

UDP(Echoserver)

网络命令 Ping 命令 检测网络是否连通 使用方法: ping -c 次数 网址ping -c 3 www.baidu.comnetstat 命令 netstat 是一个用来查看网络状态的重要工具. 语法&#xff1a;netstat [选项] 功能&#xff1a;查看网络状态 常用选项&#xff1a; n 拒绝显示别名&#…...

CentOS下的分布式内存计算Spark环境部署

一、Spark 核心架构与应用场景 1.1 分布式计算引擎的核心优势 Spark 是基于内存的分布式计算框架&#xff0c;相比 MapReduce 具有以下核心优势&#xff1a; 内存计算&#xff1a;数据可常驻内存&#xff0c;迭代计算性能提升 10-100 倍&#xff08;文档段落&#xff1a;3-79…...

从 GreenPlum 到镜舟数据库:杭银消费金融湖仓一体转型实践

作者&#xff1a;吴岐诗&#xff0c;杭银消费金融大数据应用开发工程师 本文整理自杭银消费金融大数据应用开发工程师在StarRocks Summit Asia 2024的分享 引言&#xff1a;融合数据湖与数仓的创新之路 在数字金融时代&#xff0c;数据已成为金融机构的核心竞争力。杭银消费金…...

tomcat入门

1 tomcat 是什么 apache开发的web服务器可以为java web程序提供运行环境tomcat是一款高效&#xff0c;稳定&#xff0c;易于使用的web服务器tomcathttp服务器Servlet服务器 2 tomcat 目录介绍 -bin #存放tomcat的脚本 -conf #存放tomcat的配置文件 ---catalina.policy #to…...

MyBatis中关于缓存的理解

MyBatis缓存 MyBatis系统当中默认定义两级缓存&#xff1a;一级缓存、二级缓存 默认情况下&#xff0c;只有一级缓存开启&#xff08;sqlSession级别的缓存&#xff09;二级缓存需要手动开启配置&#xff0c;需要局域namespace级别的缓存 一级缓存&#xff08;本地缓存&#…...

前端调试HTTP状态码

1xx&#xff08;信息类状态码&#xff09; 这类状态码表示临时响应&#xff0c;需要客户端继续处理请求。 100 Continue 服务器已收到请求的初始部分&#xff0c;客户端应继续发送剩余部分。 2xx&#xff08;成功类状态码&#xff09; 表示请求已成功被服务器接收、理解并处…...

2.2.2 ASPICE的需求分析

ASPICE的需求分析是汽车软件开发过程中至关重要的一环&#xff0c;它涉及到对需求进行详细分析、验证和确认&#xff0c;以确保软件产品能够满足客户和用户的需求。在ASPICE中&#xff0c;需求分析的关键步骤包括&#xff1a; 需求细化&#xff1a;将从需求收集阶段获得的高层需…...

Python的__call__ 方法

在 Python 中&#xff0c;__call__ 是一个特殊的魔术方法&#xff08;magic method&#xff09;&#xff0c;它允许一个类的实例像函数一样被调用。当你在一个对象后面加上 () 并执行时&#xff08;例如 obj()&#xff09;&#xff0c;Python 会自动调用该对象的 __call__ 方法…...