网页之js

article/2025/10/11 1:02:42

js

    • js
      • js基础语法规则
        • 数据类型
      • 函数
        • 定义
        • 调用
      • 对象
        • 内置对象
        • 自定义对象
        • bom
          • 窗口移动
        • dom
        • css样式
      • 事件

在前面的博客中我写了一些html和css样式的基础,但是,哪些仍然不够,碰到一些复杂的功能可能就无法解决了,所以我们又用到了js

js

那么先来讲讲js,这个可以解决很多在页面操作上的问题
首先JavaScript虽然名字带Java,但是实际上他俩没啥关系,不过js用了很多的Java的思想,所以你会发觉,它用起来有不少地方和Java类似

js基础语法规则

先来说说js改怎么起手吧,一开始就是导入js
这里导入方式,
第一种行内导入:

<a href="#" onclick="alert('hello world')">点击我</a>
在标签内部写,其中后面的那个onclick接的就是js的一种动作

第二种是写在script中如:

<script type="text/javascript">			alert("hello world...");			
</script>
这一片代码放在页面中就会生效,不过推荐写在body标签里的最下面

第三种,从外部引入:

在js目录下写一个hello.js文件然后用下面的方式引入
不过要注意的是用于引入的script标签内就不要再写代码了
一个script只做一件事,要么引入,要么写js代码
<script src="js/hello.js" type="text/javascript"></script>
这个引入的代码推荐跟在title标签后面,也就是header标签里

然后是写注释,这个就不多说了,和Java是一样的
变量命名方面,请参照Java,都是不能使用用关键字、不能数字开头等规则,不过由于javascript是弱类型语言,所以有一点和Java不一样,变量类型是动态的,就是声明变量的时候不需要定义变量的数据类型,使用var就行了
然后是代码调试,
在Java中调试可以使用System.out.println();来在控制台输入,和debug断点测试
在js中也有自己的测试方式
可以用alert()弹窗
document.write();文档输出至页面内
console.log在游览器的控制台中输出,顺带一提可以按F12来打开控制台
在这里插入图片描述
也可以使用页面的断点测试
在这里插入图片描述
流程控制也就是条件循环这些是和Java一样的

数据类型

虽然在ja里对于变量的数据类型没有要求,但是后面的值还是有类型的
这里就可以使用typeof进行检测
例如:

var a = 123
console.log(typeof a);这里就可以在页面控制台中观看结果

js中数据有这几类
首先是number
这是数字类型包含整数,小数,和各种进制的数字
其中比较特别的有NaN,它不等于任何值包括它自己只能使用isNaN()来判断
还有就是Infinity,它比任何数字都要大,-Infinity比任何数字都要小

第二个是string
这是字符串类型,不同于Java里只能用双引号,在js中字符串即可以用双引号,也可以用单引号

第三个是boolean,
只能是true 和false

第四个是undefined
这个表示变量未定义

第五个是null
这表示空值,不存在,但这也是一个空的对象指针,在使用typeof检测时会返回object

然后是object
对象,是一组数据和功能(函数)的集合。可以用new操作符后跟要创建的对象类型的名称来创建。也可以用字面量表示法创建。
例如:

var person = {name:'zhangsan'} ;两种都是对象对的创建方式
var obj1= new Object(); 

再来看看运算符,这里和java还是有不少差别的
首先+和-,这个就不说了,谁都会的
然后是 / 号在Java中不管是啥,是要 /0,绝对会报错,但是js不一样,人家 /0 还有值

console.log(-1/0); // -Infinity
console.log(1/0);  // Infinity
console.log(0/0)   //  NaN
console.log(isNaN(0/0))  // true

然后是 *、 %、 ++、 - -这些都和Java是一样的
不过就是还有 **这个是计算幂,优先级比较高

console.log(3**4); // 81
console.log(-3**3); // 报错
console.log((-3)**3); // -27
console.log(-(3**3)); // -27

再来说下比较运算符
这个大部分和Java相同,就来看看不同的地方

==,只判断值是否相等,在js中有些特例
"1" == 1  // true
1 == true   // true
0 == false   // true
null == undefined // true
NaN == NaN // false
=

http://chatgpt.dhexx.cn/article/BnB0gTco.shtml

相关文章

3.2JavaScript网页编程——JavaScript网页编程基础

这里写目录标题 总体JS知识流程JS基本知识JS组成引入方式&#xff1a;内联、内部形式、外部输入输出字面量let&#xff08;推荐&#xff09;和var&#xff08;面经有&#xff09;变量&#xff08;标识符&#xff09;规则&#xff08;31&#xff08;不能数字开头&#xff09;&am…

网页设计之JavaScript

文章目录 JavaScript笔记一.JavaScript概述1.JavaScript历史2.javaScript与java的区别3.javaScript的作用4.JavaScript与html,css关系 二.基本语法1.位置2.变量3.控制语句 三.函数&#xff0c;内置对象与事件1.函数基本语法&#xff1a;全局函数&#xff1a; 2.内置对象&#x…

JS实现网页效果

function $(id){return document.getElementById(id); } function $name(name){return document.getElementsByName(name); }树形菜单 onclick事件改变display属性来控制子树的显示开关效果function treeShow(id){//console.log("事件添加成功");if(document.getElem…

JavaScript—— 常见网页特效

目录 一、常见网页特效1. 案例&#xff1a;网页轮播图1.1 案例分析1.1.1 左右按钮的显示与隐藏1.1.2 动态生成小圆圈1.1.3 小圆圈的排他思想1.1.4 点击小圆圈滚动图片1.1.5 点击右侧按钮一次&#xff0c;就让图片滚动一张1.1.6 克隆第一张图片1.1.7 点击右侧按钮&#xff0c;小…

php几种常用的加密解密算法

本文给大家介绍php的三种常用的加密解密算法&#xff0c;有一定的参考价值&#xff0c;有需要的朋友可以参考一下&#xff0c;希望对你们有所帮助。 php 自带的加密函数&#xff1a; 不可逆的加密函数为&#xff1a;md5()、sha1()、crypt() md5() 用来计算 MD5 哈稀 md5(stri…

加解密算法概述

文章目录 加解密算法概述前言概述加解密算法国密算法 应用总体对称加解密非对称加解密 实现 加解密算法概述 前言 密码由来已久&#xff0c;相传公元前405年&#xff0c;雅典和斯巴达之间的伯罗奔尼撒战争最早出现密码&#xff0c;通过杂乱无章的字母拼接成一段话就是要传递的…

AES加密解密算法设计(C++)

目 录 1&#xff0e; 背景与意义 4 2. 系统设计 5 2.1系统主要目标 5 2.2主要软件需求&#xff08;运行环境&#xff09; 5 2.3功能模块与系统结构 6 3 系统功能程序设计 8 3.1基本要求部分 8 3.1.1 字节替换 8 3.1.2行移位 9 3.1.3列混合 11 3.1.4密钥加 13 3.1.5密钥扩展 14 …

加解密算法

总结 推荐使用的算法&#xff1a; 对称加密算法&#xff1a;AES-GCM-256&#xff0c;SM1 (硬件国密), SM4 (国密)非对称加密算法&#xff1a;RSA2048&#xff0c;SM2 (国密)信息摘要算法&#xff1a;SHA256&#xff0c;SM3 (国密散列算法) 对称加密算法/AES-GCM-256: GCMGM…

加密解密及算法详解

1、简介 今天我要给大家分享的是互联网通信中用到的各种加密解密算法&#xff0c;在我们介绍加解密知识前&#xff0c;首先我们了解一下密码学、密码、加密、数字签名、密钥交换等相关术语的含义。 1.1 密码学 密码学是研究编制密码和破译密码的技术科学。研究密码变化的客观规…

常见的加密解密算法

文章目录 一、概述二、区别 一、概述 加密分为单向加密和双向加密&#xff1a; 单向加密 又称为不可逆加密&#xff0c;即生成密文无法反解的一种加密方式&#xff1b;eg:MD5和SHA系列、HMAC。 双向加密 又称为可逆加密&#xff0c;即生成密文后&#xff0c;在需要的时候可以反…

RSA 加密解密算法实现(简单,易懂)!!!

目录 一、什么是RSA算法 1.对称加密 2.非对称加密 3.非对称加密的应用 二、RSA算法的基础操作步骤 1.生成公钥和私钥 2.用公钥加密信息 3.用私钥解密信息 三、AC代码 六、RSA算法的测试 七、共勉 一、什么是RSA算法 在计算机中常用的加密算法分为两类&#xff1a;对称…

13种加密与解密算法【一】

这15种加密解密算法分别是&#xff1a;散列哈希[MD5、SHA1、CRC32]&#xff0c;对称[DES&#xff0c;3DES&#xff08;TDEA、Triple DES&#xff09;&#xff0c;AES、&#xff0c;Blowfish&#xff0c;RC4、RC5&#xff0c;IDEA]&#xff0c;Base64、Rabbit、Escape。【三种分…

【2021最新版】Linux面试题总结(48道题含答案解析)

文章目录 1、绝对路径用什么符号表示&#xff1f;当前目录、上层目录用什么表示&#xff1f;主目录用什么表示? 切换目录用什么命令&#xff1f;2、怎么查看当前进程&#xff1f;怎么执行退出&#xff1f;怎么查看当前路径&#xff1f;3、怎么清屏&#xff1f;怎么退出当前命令…

linux操作系统期末考试题库

别光看点个赞呗 文档完整下载链接&#xff1a; w​​​​​​​w​​​​​​​https://download.csdn.net/download/weixin_59241300/87299684 1. cal命令 2.cat命令 3.cd命令 4.date命令 5.echo命令 6.grep命令 7.head 命令 8.ls 命令 9.touch 命令 10.more命令 …

Linux上机考试试题

Linux基础机考测试题 1、如果忘记登录密码&#xff0c;如何破解超级用户root的密码&#xff0c;并将密码改为redhat。&#xff08;操作过程抓图体现&#xff09; 开机在出现grub画面&#xff0c;按e键 用上下键选中第二项(类似于kernel /boot/vmlinuz-2.4.18-14 ro rootLABEL…

linux考试题库

&#xff08;Linux&#xff09;是一个自由、免费、开放的系统软件&#xff0c;支持多种硬件平台&#xff0c;多用户、多任务特点。 Linux操作系统是&#xff08;Linus Torvalds&#xff09;第一个开发的。 下列中&#xff08;单用户&#xff09;不是Linux的特点。 Linux一般…

Linux期末考试题库(超全)

文章目录 Linux期末考试题库选择题填空题简答题操作题 Linux期末考试题库 选择题 在创建Linux分区时&#xff0c;一定要创建&#xff08; D &#xff09;两个分区 A. FAT/NTFS  B. FAT/SWAP  C. NTFS/SWAP  D.SWAP/根分区 在Red Hat Linux 9 中&#xff0c;系统默…

虚拟机镜像文件高速下载方法之一

虚拟机镜像文件高速下载方法之一&#xff08;外加镜像文件合集打包&#xff09; 1.打开网址网易开源镜像站 2.打开对应文件夹&#xff08;比如下载kali镜像文件&#xff09; &#xff08;1&#xff09;点击 kali-images/ &#xff08;2&#xff09;点击自己需要的版本(此处我…

添加虚拟机镜像centso 8的步骤

此篇文章仅介绍添加虚拟机镜像的步骤&#xff0c;特别说明这里以centso 8为例 如有需要安装VMware虚拟机&#xff0c;可以通过以下链接跳转至对应文章 VMware虚拟机安装配置及虚拟机网络模式说明https://blog.csdn.net/weixin_55883492/article/details/123790174?spm1001.2…

vmware 虚拟机恢复ghost镜像文件

一、下载winPE.iso、软碟通 链接&#xff1a;https://pan.baidu.com/s/1Ty2td8_9-3Dr7Qc5XHhyNw 提取码&#xff1a;wtuk 二、恢复&#xff1a; 1、配置基础Vmware系统模板&#xff0c;如何配置可百度搜索 注意&#xff1a;内存必须为2G以上,否则无法使用PE 2、CD/DVD — …