百度360必应搜狗淘宝本站头条
vba高级教程svn连接scheduledtaskmybatis plus结构体数组
当前位置：网站首页 > 编程网 > 正文

javaScript-第一章 javascript第二章

yuyutoo 2024-10-12 00:40 5 浏览 0 评论

一、javaScript介绍

JavaScript是一种基于对象和事件驱动的、并具有安全性能的脚本语言

(客户端语言)

JavaScript特点

向HTML页面中添加交互行为

脚本语言，语法和Java类似

解释性语言，边解释边执行


JavaScript组成：ECMAScript 、DOM、BOM

基本结构：

<script type="text/javascript">

<!—

JavaScript 语句;

—>

</script >

示例：

……

<title>初学JavaScript</title>

</head>

<body>

<script type="text/javascript">

document.write("初学JavaScript");

document.write("<h1>Hello，JavaScript</h1>");

</script>

</body>

</html>

注：<script>…</script>可以包含在文档中的任何地方，只要保证这些代码在被使用前已读取并加载到内存即可

执行原理：


外部JS文件：

<script src="export.js" type="text/javascript"></script>

直接在HTML标签中使用：

<input name="btn" type="button" value="弹出消息框"

onclick="javascript:alert('欢迎你');"/>


二、基本常见语法：

1、核心语法：同时声明和赋值变量

var catName= "皮皮";

2、数据类型：

undefined:var width;

变量width没有初始值，将被赋予值undefined;

null:表示一个空值，与undefined值相等；

number：var iNum=23; //整数

var iNum=23.0; //浮点数

boolean:true 和false;

string:一组被引号（单引号或双引号）括起来的文本

var string1="This is a string";

3、typeof运算符：

typeof检测变量的返回值

typeof运算符返回值如下函数

undefined：变量被声明后，但未被赋值

string：用单引号或双引号来声明的字符串

boolean：true或false

number：整数或浮点数

object：javascript中的对象、数组和nul

4、String对象：


5、数组：


数组的常用属性和方法

类别 名称 描述

属性 length 设置或返回数组中元素的数目

方法 join( ) 把数组的所有元素放入一个字符串，通过一个的分隔符进行分隔

sort() 对数组排序

push() 向数组末尾添加一个或更多 元素，并返回新的长度


6、逻辑控制语句：

if(条件)

{

//JavaScript代码;

}

else

{

//JavaScript代码;

}

switch (表达式)

{ case 常量1 :

JavaScript语句1;

break;

case 常量2 :

JavaScript语句2;

break;

...

default :

JavaScript语句3;

}

for(初始化; 条件; 增量)

{

JavaScript代码; }


while(条件)

{

JavaScript代码;

}

break ，continue 用法示例：

<script type="text/javascript">

var i=0;

for(i=0;i<=5;i++){

if(i==3){

continue;

}

document.write("这个数字是："+i+"<br/>");

}

</script>

7、常用的输入/输出

alert("提示信息");


prompt("提示信息", "输入框的默认信息");

prompt("请输入你喜欢的颜色","红色");

prompt("请输入你喜欢的颜色","");


三、常用系统函数

parseInt ("字符串")

将字符串转换为整型数字

如: parseInt ("86")将字符串“86“转换为整型值86

parseFloat("字符串")

将字符串转换为浮点型数字

如: parseFloat("34.45")将字符串“34.45“转换为浮点值34.45

isNaN()

用于检查其参数是否是非数字


定义函数：

function 函数名( ){

//JavaScript语句

[return 返回值]

}

调用无参函数

<input name="btn" type="button"

value="显示5次欢迎学习JavaScript" onclick="study( )" />


function study( ){

for(var i=0;i<5;i++){

document.write("<h4>欢迎学习JavaScript</h4>");

}

}

事件：

名称说明

onload一个页面或一幅图像完成加载

onclick鼠标单击某个对象

onmouseover鼠标指导移到某元素上

onkeydown某个键盘按键被按下

onchange域的内容被改变


四、代码示例：

九九乘法表编写：

<html>

<head>

<title>九九乘法表</title>

</head>

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

<body>

<form action="#">

<input type="button" value="点击观看九九乘法表" onclick="table()">

</form>

</body>

</html>


// 九九乘法表方法

function table(){

for(var i=1;i<=9;i++){

for(var j=1;j<=i;j++){

document.write(i+"*"+j+"="+j*i+"&nbsp;&nbsp;&nbsp;&nbsp;");

}

document.write("<br/>");

}

}

示例2：统计科目成绩总和

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>科目总成绩</title>

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

</head>

<!-- 页面加载时间onlioad（页面加载完后显示的资源） -->

<body onload="course();">

<form action="#">

<input type="button" value="点击计算科目成绩总和" onclick="course()">

</form>

</body>

</html>

// 第一种做法：

// function course() {

// var java = parseInt(prompt('请输入JAVA科目成绩：'));

// var html = parseInt(prompt('请输入html科目成绩：'));

// var css = parseInt(prompt('请输入css科目成绩：'));

// var js = parseInt(prompt('请输入js科目成绩：'));

// sum = java + html + css + js;

// // 第一种做法

// if( 0<java&&java<=100 && 0<html&&html<=100 && 0<css&&css<=100 && 0<js&&js<=100){

// document.write("四门课的成绩总成绩为："+sum);

// }else{

// document.write("您输入的数字不符合规范")

// }


// // 第二种做法

// // if (isNaN(java) || isNaN(html) || isNaN(css) || isNaN(js)) {

// // document.write("您输入的数字不符合规范");

// // } else {

// // document.write("四门课的成绩总成绩为：" + sum);

// // }

// }


// // 第二种做法：

// function course() {

// var java = +prompt('请输入JAVA科目成绩：');

// var html = +prompt('请输入html科目成绩：');

// var css = +prompt('请输入css科目成绩：');

// var js = +prompt('请输入js科目成绩：');

// sum = java + html + css + js;

// if( 0<java&&java<=100 && 0<html&&html<=100 && 0<css&&css<=100 && 0<js&&js<=100){

// document.write("四门课的成绩总成绩为："+sum);

// }else{

// document.write("您输入的数字不符合规范")

// }




// }




// 统计考试科目成绩

function course() {

var num = parseInt(prompt("请输入有几门考试科目："));

if (!notZeroNotNegative(num)) {

return;

}

let count = 0;

for (let i = 0; i < num; i++) {

let score = parseInt(prompt("请输入第" + (i + 1) + "门课的成绩：", ""));

if (!notNegative(score)) {

return;

}

count += score;

}

alert(num + "门科目的总成绩是：" + count);

}


//判断接受是否是非零、非负数

function notZeroNotNegative(num) {

if (isNaN(num)) {

alert("输入的必须是数字！");

return false;

}

return true;

}



// 判断科目成绩是否是非零、非负数

function notNegative(score) {

if (isNaN(score)) {

alert("输入的必须是数字！");

return false;

}

if (score < 0) {

alert("输入的必须是非负数");

return false;

}

return true;

}

相关推荐

ETCD 故障恢复（etc常见故障）

概述Kubernetes集群外部ETCD节点故障，导致kube-apiserver无法启动。...

在Ubuntu 16.04 LTS服务器上安装FreeRADIUS和Daloradius的方法

FreeRADIUS为AAARadiusLinux下开源解决方案，DaloRadius为图形化web管理工具。...

如何排查服务器被黑客入侵的迹象（黑客 抓取服务器数据）

---排查服务器是否被黑客入侵需要系统性地检查多个关键点，以下是一份详细的排查指南，包含具体命令、工具和应对策略：---###**一、快速初步检查**####1.**检查异常登录记录**...

使用 Fail Ban 日志分析 SSH 攻击行为

通过分析`fail2ban`日志可以识别和应对SSH暴力破解等攻击行为。以下是详细的操作流程和关键分析方法：---###**一、Fail2ban日志位置**Fail2ban的日志路径因系统配置...

《5 个实用技巧，提升你的服务器安全性，避免被黑客盯上!》

服务器的安全性至关重要，特别是在如今网络攻击频繁的情况下。如果你的服务器存在漏洞，黑客可能会利用这些漏洞进行攻击，甚至窃取数据。今天我们就来聊聊5个实用技巧，帮助你提升服务器的安全性，让你的系统更...

聊聊Spring AI Alibaba的YuQueDocumentReader

序本文主要研究一下SpringAIAlibaba的YuQueDocumentReaderYuQueDocumentReader...

Mac Docker环境，利用Canal实现MySQL同步ES

Canal的使用使用docker环境安装mysql、canal、elasticsearch，基于binlog利用canal实现mysql的数据同步到elasticsearch中，并在springboo...

RustDesk:开源远程控制工具的技术架构与全场景部署实战

一、开源远程控制领域的革新者1.1行业痛点与解决方案...

长安汽车一代CS75Plus2020款安装高德地图7.5

不用破解原车机，一代CS75Plus2020款，安装车机版高德地图7.5，有红绿灯读秒！废话不多讲，安装步骤如下：一、在拨号状态输入：在电话拨号界面，输入:*#518200#*（进入安卓设置界面，...

Zookeeper使用详解之常见操作篇（zookeeper ui）

一、Zookeeper的数据结构对于ZooKeeper而言，其存储结构类似于文件系统，也是一个树形目录服务，并通过Key-Value键值对的形式进行数据存储。其中，Key由斜线间隔的路径元素构成。对...

zk源码—4.会话的实现原理一（会话层的基本功能是什么）

大纲1.创建会话...

Zookeeper 可观测性最佳实践（zookeeper能够确保）

Zookeeper介绍ZooKeeper是一个开源的分布式协调服务，用于管理和协调分布式系统中的节点。它提供了一种高效、可靠的方式来解决分布式系统中的常见问题，如数据同步、配置管理、命名服务和集群...

服务器密码错误被锁定怎么解决（服务器密码错几次锁）

#服务器密码错误被锁定解决方案当服务器因多次密码错误导致账户被锁定时，可以按照以下步骤进行排查和解决：##一、确认锁定状态###1.检查账户锁定状态（Linux）```bash#查看账户锁定...

zk基础—4.zk实现分布式功能（分布式zk的使用）

大纲1.zk实现数据发布订阅...

《死神魂魄觉醒》卡死问题终极解决方案:从原理到实战的深度解析

在《死神魂魄觉醒》的斩魄刀交锋中，游戏卡死犹如突现的虚圈屏障，阻断玩家与尸魂界的连接。本文将从技术架构、解决方案、预防策略三个维度，深度剖析卡死问题的成因与应对之策，助力玩家突破次元壁障，畅享灵魂共鸣...

取消回复欢迎 你 发表评论:

一周热门
最近发表
标签列表