JavaScript基础

最新推荐文章于 2022-11-23 17:32:46 发布

梦道丶

最新推荐文章于 2022-11-23 17:32:46 发布

阅读量109

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/qq_42511085/article/details/103395901

版权

JavaScript 专栏收录该内容

13 篇文章 0 订阅

订阅专栏

JavaScript基础

JavaScript是属于HTML和Web的编程语言，编程令计算机完成你需要他们做的工作。
JavaScript是web开发者必学的三种语言之一：

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

JS的使用

在HTML中，JavaScript代码必须位于<script>与</script>标签之间。
脚本可被放置在HTML页面的<body>或<head>部分中，或两者皆可。

JavaScript输出

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

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

使用innerHTML

document.getElementById("demo").innerHTML = "Hello JavaScript";
//将id为demo的HTML元素的内容更改为"Hello JavaScript"
//getElementById()该方法用来查找id名为括号内内容的HTML元素
//innerHTML表示元素内容

使用document.write()

<h1>我的第一张网页</h1>

<p>我的第一个段落</p>

<script>
document.write(5 + 6);
</script>

使用window.alert()

<h1>我的第一张网页</h1>

<p>我的第一个段落</p>

<script>
window.alert(5 + 6);
</script>

使用console.log()

<h1>我的第一张网页</h1>

<p>我的第一个段落</p>

<script>
console.log(5 + 6);
</script>

JavaScript函数和事件

JavaScript函数是一种JavaScript代码块，它可以在调用时被执行。
例如，当发生事件时调用函数，比如当按钮被点击时。
使用函数可以对代码进行复用：只要定义一次代码，就可以多次使用。

<body> 
<p id="demo">一个段落</p>
<button type="button" onclick="myFunction()">改变一下</button>

<script>
function myFunction() {
   document.getElementById("demo").innerHTML = "段落被更改。";
}
</script>

JavaScript函数语法

JavaScript函数通过function关键词进行定义，其后是函数名和括号()。
函数名课包含字母、数字、下划线和美元符号（规则与变量名相同）。
圆括号可包括由逗号分隔的参数。

function name(参数1，参数2，参数3){
	要执行的代码
}

函数调用

函数中的代码将在其他代码调用该函数时执行：

当事件发生时（当用户点击按钮时）
当JavaScript代码调用时
自调用

函数返回

当JavaScript到达return语句，函数将停止执行。
如果函数被某条语句调用，JavaScript将在调用语句之后‘返回’执行代码。
函数通常会计算出返回值，这个返回值将会返回给调用者。

var result=calculate(x,y)
function calculate(x,y){
	return x+y;
}

局部变量

在JavaScript函数中声明的变量会成为函数的局部变量，局部变量只能在函数内访问。由于局部变量只能被其函数识别，因此可以再不同函数中使用相同名称的变量。
局部变量在函数开始时创建，在函数完成时被删除。

JavaScript事件

HTML事件是发生在HTML元素上的“事情”，当在HTML页面中使用JavaScript时，JavaScript能够“应对”这些事件。
HTML事件可以是浏览器或用户做的某些事情。

HTML网页完成加载
HTML输入字段被修改

HTML按钮被点击
常见的HTML事件：

事件	描述
onchange	HTML元素已被改变
onclick	用户点击了HTML元素
onmonuseover	用户把鼠标移动到HTML元素上
onmonuseout	用户把鼠标移开HTML元素
onload	浏览器已经完成页面加载

JavaScript对象

JavaScript变量是数据值的容器。
对象也是变量，但是对象包含很多值。
JavaScript对象是被命名值的容器，名称:值对被称为属性，值以名称:值对的方式来书写（名称和值由冒号分隔）

JavaScript运算符

算术运算符

运算符	描述
+	加法
-	减法
*	乘法
/	除法
%	取余
++	递加
–	递减

赋值运算符

运算符	例子	等同于
=	x=y	x=y
+=	x+=y	x=x+y
-=	x-=y	x=x-y
*=	x*=y	x=x*y
/=	x/=y	x=x/y
%=	x%=y	x=x%y

比较运算符

运算符	描述
==	等于
===	等值等型
!=	不相等
!==	不等值或不等型
>	大于
<	小于
>=	大于或等于
<=	小于或等于
？	三元运算符

条件运算符：
语法：条件? 条件成立时输出内容:条件不成立是输出内容

逻辑运算符

运算符	描述
&&	逻辑与（当两边都为true时，结果为true）
`\|\|`	逻辑或(当有一边为true时，结果为true)
！	逻辑非(取反)

条件语句

条件判断语句：

if（条件）{
条件成立时执行语句
}else{
条件不成立时执行语句
}

else if语句

if (条件 1) {
    条件 1 为 true 时执行的代码块
} else if (条件 2) {
    条件 1 为 false 而条件 2 为 true 时执行的代码块
 } else {
    条件 1 和条件 2 同时为 false 时执行的代码块
}

switch语句

switch(表达式) {
     case n:
        代码块
        break;
     case n:
        代码块
        break;
     default:
        默认代码块
}

计算一次 switch 表达式
把表达式的值与每个 case 的值进行对比
如果存在匹配，则执行关联代码

循环语句

for循环

for (语句 1; 语句 2; 语句 3) {
     要执行的代码块
}

for/in循环

var person = {fname:"Bill", lname:"Gates", age:62}; 

var text = "";
var x;
for (x in person) {
    text += person[x];
}

while循环

while (条件) {
    要执行的代码块
}

do/while循环

do {
    要执行的代码块
}

while (条件);

梦道丶

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript基础

JavaScript基础JavaScript是属于HTML和Web的编程语言，编程令计算机完成你需要他们做的工作。JavaScript是web开发者必学的三种语言之一：HTML定义网页的内容CSS规定网页的布局JavaScript对网页行为进行编程JS的使用在HTML中，JavaScript代码必须位于<script>与</script>标签之间。脚本...
复制链接

扫一扫