当前位置: 首页 > 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…...

proxy-doctor:自动化诊断与修复开发工具代理配置的利器

1. 项目概述与核心价值最近在折腾一些需要稳定网络连接的项目时&#xff0c;遇到了一个老生常谈但又极其恼人的问题&#xff1a;代理配置。无论是开发环境里的包管理工具&#xff0c;还是日常使用的命令行工具&#xff0c;一旦涉及到网络请求&#xff0c;代理设置不对&#xff…...

一键获取Steam游戏清单:Onekey工具让游戏管理变得如此简单

一键获取Steam游戏清单&#xff1a;Onekey工具让游戏管理变得如此简单 【免费下载链接】Onekey Onekey Steam Depot Manifest Downloader 项目地址: https://gitcode.com/gh_mirrors/one/Onekey 你是否曾为管理Steam游戏文件而烦恼&#xff1f;想备份心爱的游戏却不知从…...

AI量化交易框架解析:从架构设计到实战部署

1. 项目概述&#xff1a;一个AI驱动的加密资产对冲基金框架最近在GitHub上看到一个挺有意思的项目&#xff0c;叫“ai-hedge-fund-crypto”。光看名字&#xff0c;就能感受到一股浓浓的“量化AI加密”的混合气息。这其实是一个开源框架&#xff0c;旨在帮助开发者或量化研究员&…...

将HermesAgent项目接入Taotoken的详细配置步骤与注意事项

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 将HermesAgent项目接入Taotoken的详细配置步骤与注意事项 本文旨在为开发者提供一份清晰的指南&#xff0c;帮助你将HermesAgent项…...

终极免费Switch模拟器yuzu:解决电脑玩任天堂游戏的5大痛点

终极免费Switch模拟器yuzu&#xff1a;解决电脑玩任天堂游戏的5大痛点 【免费下载链接】yuzu 任天堂 Switch 模拟器 项目地址: https://gitcode.com/GitHub_Trending/yu/yuzu 想在电脑上畅玩Switch游戏却总是遇到各种问题&#xff1f;yuzu模拟器作为全球最受欢迎的开源任…...

2019 年旧作升级!用木材与电路打造更美观的电压表时钟

2019 年旧作升级&#xff01;用木材与电路打造更美观的电压表时钟早在 2019 年&#xff0c;作者制作了一个简单的电压表时钟&#xff0c;这类时钟使用模拟面板电压表来显示时间&#xff0c;而非传统钟面。不过&#xff0c;网上大多数此类设计过于复杂且不太美观&#xff0c;于是…...

终极指南:如何在Mac上免费备份和导出微信聊天记录

终极指南&#xff1a;如何在Mac上免费备份和导出微信聊天记录 【免费下载链接】WeChatExporter 一个可以快速导出、查看你的微信聊天记录的工具 项目地址: https://gitcode.com/gh_mirrors/wec/WeChatExporter 你是否曾因误删重要微信聊天记录而懊恼&#xff1f;或是需要…...

Kafka运维新选择:Offset Explorer(Kafka Tool)在Windows下的详细评测与实战技巧

Kafka运维新选择&#xff1a;Offset Explorer在Windows下的深度评测与高阶实战 当Kafka集群规模从几个节点扩展到数十甚至上百个Broker时&#xff0c;命令行工具kafka-topics.sh和kafka-console-consumer.sh开始显得力不从心。这时&#xff0c;一个得力的可视化工具就像黑暗中的…...

ViGEmBus终极指南:Windows游戏控制器模拟驱动完全解析

ViGEmBus终极指南&#xff1a;Windows游戏控制器模拟驱动完全解析 【免费下载链接】ViGEmBus Windows kernel-mode driver emulating well-known USB game controllers. 项目地址: https://gitcode.com/gh_mirrors/vi/ViGEmBus ViGEmBus是一款运行在Windows内核模式的驱…...

开源银行API模拟器Bankr Buddy:金融科技开发的本地化测试解决方案

1. 项目概述&#xff1a;一个为开发者准备的银行API模拟器如果你正在开发一个需要与银行账户数据打交道的应用&#xff0c;无论是个人财务管理工具、预算分析软件&#xff0c;还是企业级的财务聚合服务&#xff0c;你肯定遇到过同一个难题&#xff1a;如何在不触碰真实用户敏感…...