JavaScript 简介

JavaScript 简介

HTML 定义了网页的内容(房屋架构)

CSS 描述了网页的布局(装饰房子让房子更美观。)

JavaScript 控制了网页的行为(让房屋更具功能性。)

JavaScript 是什么

JavaScript是web(网页)开发中必不可少的脚本语言,不需要编译即可运行,运行在客户端,通过浏览器解析执行。和HTML和CSS一起工作,创建动态交互式的网页。

javaScript 被用来改进设计、验证表单、检测浏览器、创建 cookies,等等。JavaScript是因特网上最流行的脚本语言,并且可在所有主要的浏览器中运行,比如:Internet Explorer、Maxthon、Mozilla、Firefox、Netscape、Chrome 和 Opera等,

脚本语言:是指一种编程语言,依赖解释器执行代码。常见的脚本语言有Python、JavaScript、PHP、Ruby等等

JavaScript的作用

开发者创建动态、响应式的用户界面。JavaScript在进行前后端交互时(客户端和服务器端),通过API接口与后端服务进行通信和数据交换。可以通过后端提供的接口进行交互,发送请求和接收响应,比如处理身份验证和授权,通过与后端API接口交互,管理用户的登录状态和访问权限等。

动态内容更新

在不进行页面加载的情况下与服务器进行APL接口交互,通过创建XMLHttpRequest的对象或使用fetch函数发起异步请求(Ajax)实现在不渲染整个页面的情况下动态更新部分内容。

表单验证

在数据前端js代码能够进行表单的验证。

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>顾安的博客</title> 
</head>
<body>
	
<h1>这是一个js代码对输入内容是否为数字的验证</h1>
<p>请输入数字。如果输入值不是数字,浏览器会弹出提示框。</p>
<input id="js" type="text">
<script>
function myFunction()
{
	var x=document.getElementById("js").value;  //getElementById(js)去找到js变量的所在的位置
	if(x==""||isNaN(x))                 
	{
		alert("不是数字");
	}
}
</script>
<button type="button" onclick="myFunction()">点击这里</button>
	
</body>
</html>

在这里插入图片描述

动态用户界面

JS可以控制和改变网页布局,样式和行为 eg 改变网页样式,想用用户事件,

改变html内容

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
</head>
<body>
	
<h1>我的第一段 JavaScript</h1>
<p id="demo">
JavaScript 能改变 HTML 元素的内容。
</p>
<script>
function myFunction()
{
	x=document.getElementById("demo");  // 找到元素
	x.innerHTML="Hello JavaScript!";    // 改变内容
}
</script>
<button type="button" onclick="myFunction()">点击这里</button>
	
</body>
</html>

在这里插入图片描述

点击后变为

在这里插入图片描述

JavaScript的注释

单行注释以 // 开头。

多行注释以 /* 开始,以 */ 结尾。

JavaScript引用

js代码可以直接写到HTML文件中,必须存放到script标签中。也可放在head标签,body标签中。

js代码也可放在外部文件中,文件扩展名为 .js ,srcipt中src属性放文件的路径。

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

JavaScript的变量

1:avaScript 变量可用于存放值(比如 x=5)和表达式(比如 z=x+y)。

  • 变量必须以字母开头
  • 变量也能以 $ 和 _ 符号开头(不推荐)
  • 变量名称对大小写敏感

2:在 JavaScript 中创建变量通常称为"声明"变量。

​ 使用var声明变量

var guan

​ 声明便令未赋值时,其值为undefined,向变量赋值用 =

guan="一个csdn上的博客"

JavaScript数据类型

基本类型

字符串(String):用单引号或双引号引起来的内容。

数字(Number):不分整型浮点型,都为数字。

布尔(Boolean):逻辑上只有两种结果,true或false。

空(Null)

未定义(Undefined)

对象数据类型

数组(Arry):下标从0开始

var cars=new Array();
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";

var cars=["Saab","Volvo","BMW"];
var cars=new Array("Saab","Volvo","BMW");

对象(Object):是拥有属性和方法的数据。

对象由花括号分隔。在括号内部,对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔

var person={firstname:"John", lastname:"Doe", id:5566};

访问对象属性:会作为字符串返回

name = person.fullName();
  • 26
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
JavaScript教程是一种指导学习者如何使用JavaScript编程语言的文件或文档。它提供了关于JavaScript语言的基本知识、概念、语法和用法的详细说明和解释。JavaScript教程通常包含以下内容: 1. JavaScript简介:介绍JavaScript的背景、用途和发展历程,帮助学习者对JavaScript有一个基本的了解。 2. JavaScript语法:解释JavaScript的基本语法规则,如变量的声明、数据类型、运算符、控制流语句等,帮助学习者理解和使用JavaScript语言。 3. JavaScript对象:介绍JavaScript中的对象概念和操作,包括对象的创建、属性的访问和修改以及方法的调用,帮助学习者掌握JavaScript面向对象编程的基本原理。 4. JavaScript事件处理:说明如何在JavaScript中处理用户交互事件,如点击、键盘输入等,以及如何编写相应的事件处理函数,帮助学习者实现交互式的网页。 5. JavaScript DOM操作:介绍如何使用JavaScript操作HTML文档对象模型(DOM),如查找、创建、修改和删除HTML元素,以及事件监听和触发,帮助学习者实现动态网页效果。 6. JavaScript异步编程:讲解JavaScript中的异步编程模式和技术,如回调函数、Promise、异步函数等,帮助学习者处理和管理异步操作。 7. JavaScript框架和库:介绍常用的JavaScript框架和库,如jQuery、React、Vue等,以及如何使用它们简化开发工作,提高开发效率。 通过学习JavaScript教程,学习者可以逐步掌握JavaScript编程语言的核心概念和技术,在网页开发、前端工程和移动应用开发等领域应用JavaScript,实现丰富的交互和动态效果。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值