JavaScript基础

最新推荐文章于 2024-10-08 13:51:35 发布

ssb438438

最新推荐文章于 2024-10-08 13:51:35 发布

阅读量107

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/ssb438438/article/details/117689918

版权

1.1JavaScript简介

JavaScript是一门脚本语言。计算机中除了脚本语言还有一下几种语言，这里我们总结一下：

汇编语言
脚本语言
机器语言
高级语言

以下注解可作为拓展材料：

1、脚本语言又被称为扩建的语言，或者动态语言，是一种编程语言，用来控制软件应用程序，脚本通常以文本（如ASCII)保存，只在被调用时进行解释或编译。

2、汇编语言（assembly language）是一种用于电子计算机、微处理器、微控制器或其他可编程器件的低级语言，亦称为符号语言。在汇编语言中，用助记符代替机器指令的操作码，用地址符号或标号代替指令或操作数的地址。在不同的设备中，汇编语言对应着不同的机器语言指令集，通过汇编过程转换成机器指令。特定的汇编语言和特定的机器语言指令集是一一对应的，不同平台之间不可直接移植。

3、机器语言是机器能直接识别的程序语言或指令代码，勿需经过翻译，每一操作码在计算机内部都有相应的电路来完成它，或指不经翻译即可为机器直接理解和接受的程序语言或指令代码。机器语言使用绝对地址和绝对操作码。不同的计算机都有各自的机器语言，即指令系统。从使用的角度看，机器语言是最低级的语言。

4、高级语言（High-level programming language）相对于机器语言（machine language）是一种指令集的体系。在这种语言下，其语法和结构更类似汉字或者普通英文，且由于远离对硬件的直接操作，使得一般人更容易学习。高级语言通常按其基本类型、代系、实现方式、应用范围等分类。

脚本语言的特点：对比其他类型语言编程速度更快，不需要编译、简单、易学、易用、灵活性高。当然这样的高灵活性也是有牺牲的，它的运行速度相对于其他的语言可能更慢，运行时更消耗资源。

JavaScript就是脚本语言中的一种，被广泛应用于Web应用开发，常用开为网页添加各式各样的动态功能，下图是2019年1月全球编程语言排行榜。

为何学习 JavaScript？

JavaScript 是 web 开发者必学的三种语言之一：

HTML定义网页的内容
CSS规定网页的布局/样式
JavaScript对网页行为进行编程

JavaScript的应用：淘宝的搜索功能、团立方中的轮播图、产品经理建立项目等等。

JavaScript组成：

ECAMScript：JavaScript语法和基本对象
DOM：文档对象模型
BOM：浏览器对象模型。

1.2JavaScript基本用法

JavaScript应该放在什么位置？

①行内JS

<button onClick="alert('Hello Everybody！')">按钮</button>

优点：非常的直观，直接作用于你写的元素

缺点：1、结构分离不清晰(html/csss/js)

2、复用性底

3、不利于后期维护与修改

②内部JS

<script>

//JavaScript 代码

</script>

优点：1、结构分离更清晰(较行内JS)。2、当前页面可复用 3、利于后期维护和修改

缺点：1、只能当前页面使用，不能多页面复用。2、多页面之间的维护比较麻烦。

③外部JS

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

1.3JavaScript-输出

JavaScript 显示方案

JavaScript 能够以不同方式“显示”数据：

使用 window.alert() 写入警告框
使用 document.write() 写入 HTML 输出
使用 innerHTML 写入 HTML 元素
使用 console.log() 写入浏览器控制台

1.4document. getElementById()方法

语法：document.getElementById("ID ")

翻译：通过ID获取元素。

1.5 JavaScript语句、注释、变量

1.JavaScript语句是发给浏览器的命令,

这些命令的作用是告诉浏览器要做的事情。

每一句JavaScript代码格式: 语句;

例：alert("hello!");就是一个JavaScript语句

2.JavaScript-注释很重要

注释可分为单行注释与多行注释两种

单行注释，在注释内容前加符号 “//”

多行注释以"/*"开始，以"*/"结束。

3.变量

什么是变量？

什么是变量? 从字面上看，变量是可变的量；从编程角度讲，JavaScript 变量是存储数据值的容器。我们可以把变量看做一个盒子,盒子用来存放物品,物品可以是衣服、玩具、水果...等。

给变量取个名

我们为了区分盒子，可以用box1,box2等名称代表不同盒子，box1就是盒子的名字（也就是变量的名字）。

注意：变量名字可以任意取，只不过取名字要遵循一些规则:

必须以字母、下划线或美元符号开头，后面可以跟字母、下划线、美元符号和数字。例如：mysum _mychar, $numa198
变量名区分大小写，如:A与a是两个不同变量。
不允许使用JavaScript关键字和保留字做变量名。

例如：mysum, _mychar, $numal

变量声明

声明变量语法: var 变量名;

var mysum;一次声明一个变量

var mysum=12,mynum="str";一次声明多个变量

注意:变量也可以不声明，直接使用，但为了规范，需要先声明，后使用。

变量赋值

var mynum=5;//声明变量mynum并赋值

注:这里 "="号的作用是给变量赋值，不是等于号。

2.JavaScript基础

2.1document.querySelector()

定义和用法

querySelector() 方法返回文档中匹配指定 CSS 选择器的一个元素。

注意： querySelector() 方法仅仅返回匹配指定选择器的第一个元素。如果你需要返回所有的元素，请使用 querySelectorAll() 方法替代。

语法：document.querySelector(CSS selectors)

参数值

参数

类型

描述

CSS 选择器

String

必须。指定一个或多个匹配元素的 CSS 选择器。可以使用它们的 id, 类, 类型, 属性, 属性值等来选取元素。

对于多个选择器，使用逗号隔开，返回一个匹配的元素。

查找HTML元素的方法：

方法	描述
document.getElementById(id)	通过元素 id 来查找元素
document.getElementsByTagName(name)	通过标签名来查找元素
document.getElementsByClassName(name)	通过类名来查找元素