JavaScript基础(十三)

Math对象

   方法+说明

ceil()  对数进行上舍入    

例:Math.ceil(12.5)返回13;                                 Math.ceil(-12.5)返回-12                            (简单点来记就是ceil返回的值要比传入的大

   var math1= Math.ceil(12.5)

   console.log(math1);

   var math2= Math.ceil(-12.5)

   console.log(math2);

3770c988975945fdb808beecc1ff6d83.png

 

floor()   对数进行下舍入  

例:Math.floor(12.5)返回12;                               Math.floor(-12.5)返回-13                           (简单点来记就是floor返回的值要比传入的小

   var math1=Math.floor(12.5);

   console.log(math1);

   var math2=Math.floor(-12.5);

   console.log(math2);

653dc2f9eba84ea4ae8ff87f4a3d2502.png

 

round()   把数四舍五入为最接近的数  

例:Math.round(12.5)返回13;                             Math.round(-12.6)返回-13

   var math1= Math.round(12.5)

   console.log(math1);

   var math2= Math.round(-12.6)

   console.log(math2);

70b9167e7b8340f2be0a40a69d35a207.png

 

random()   返回0.0-0.1的随机数

例:

   var num= Math.random();

   console.log(num);

f7d2fbc2cddd442d93fbdc0c3ea17f77.png

比如这有个例子:

一盒鸡蛋有21个,这里有64个蛋能放几盒?
那多的咱不能扔了,这个是不是就要向上取值:
   var num=Math.ceil(64/21);
   console.log(num);

24bbf7b4fa2144ef8382f5f22dcd95fb.png

还有别的情况,我们要结果也不是非要取个近似值,我们只想要整数部分

有个方法,parseInt直接删掉小数点后内容

var num=parseInt(-20.9999);

console.log(num);

dc0627d8843f43ddaea9d8cc8530287e.png

 那ceil和floor都有简单记法,round不总结一下这不有失偏颇吗,

那必须总结一下round()四舍五入,简单来记

//正数:直接就四舍五入,没什么好说的;

//负值:不考虑负号,只对数字进行升降,小数点后<=0.5舍去,否则进上去。

var num=Math.round(-25.5);

console.log(num);

var num1=Math.round(-25.51);

console.log(num1);

46e27be305d84053a7076c78d8e9bc22.png

肯定要把情况考虑全面,有时候我们肯定还需要绝对值,还有一个取绝对值的方法Math.abs()

var num=Math.abs(-12.12);

console.log(num);

var num1=Math.abs(11.99);

console.log(num1);

7b34b6d5141f4f9898616f5657ba3fa5.png

大体这块没什么东西了,再生偏的就自己查文档了,那好,我现在想让你生成0-10的随机数怎么整?

先分析一下,肯定要用到random随机数,乘个10是不是就行了,再取整就OK了:

//随机数

var num =Math.random()*10;

//加上取整

var num1 =Math.round(Math.random()*10);

console.log(num1);

也不一定非要这么写,单举这一个方法

d87445b296814819979a44da71a78246.png

初识函数绑定事件获取input的值

这里函数是指我们制定的规则,不是数学上那些乱七八糟的东西,例如:我们定义的函数log

function log(){

   console.log("你真聪明");

   console.log("你真有活");

   console.log("你真帅");

}

调用函数:函数名()

log();

cf881b3c199c446b96730114e524cc56.png

函数可以包任意的东西

点击事件

顾名思义,点击某个地方就发生某个事件,举个例子,我们在body中写一个按钮

<body>

   <button>点击</button>

</body>

写出来,除了能点一下,什么功能都没有,想实现功能就要绑定事件,什么意思,就是你通过方法或函数写一个功能,然后通过一定方法绑定到某个标签上,然后点击标签生成的对应部分,发生你所绑定的事件:

这里我们写的button,通过onclick绑定:

 <button οnclick="">点击</button>

我们可以绑个弹窗,点一下弹出来:

<body>

   <button οnclick="alert('不长眼睛!你点到我了!!')">点击</button>

</body>

505ec203b4ce46ae8d059b995311fddc.png

但我们不是为了实现这种狗屁功能,我们可以写个函数,在onclick内绑个函数:

<!-- onclick内接函数名 -->

<body>

   <button οnclick="on()">点击</button>

</body>

<script>

   function on(){

      console.log('事件发生');

   }

</script> 

我们还没点,控制台什么事都没有

00191a8cb83a440eac451cba58056c36.png

我们点几次,后台这个函数就被调用了几次

1b2f427c1813477aa1a59c2d2da97bea.png

比如那些小广告,小弹窗啥的,绑一个clear函数,到时候一点把弹窗板块清除就行了

例如,这里我们需要判断用户输入的用户名是否合法,要求至少输入三个字:

<!-- 这里我起了个id名,下面用id名找到input框 -->

<body>

   用户名:<input type="text" id="yh" value="">

   <button οnclick="on()">注册</button>

</body>

<script>

   function on(){

      //找到input框,获取value值

      var nam=document.getElementById('yh').value;

      // console.log(nam);

      if (nam.length == 0){

         alert('用户名不能为空')

      }else if(nam.length<3){

         alert('用户名不能少于三个字')

      }else{

         alert('注册成功')

      }

   }

</script> 

d6b5f2dbca3340ee8b64db12e0927160.png

830a09ebe5234769829a8478580dc70e.png

00a1153a49804f71b00a1fd8a0020f59.png 

很轻松我们就实现这么一个功能,后面再改改默认样式好看点就行了。

上面input后value内可以写个默认名字, 用户名:<input type="text" id="yh" value="李二狗">,一点开就默认有个李二狗

39f2cd981a1a4d178bc49ec04af7bc69.png

 

有人也可能发现问题了,这里我真正注册了没有?没有,我只不过就这样写的,所以其实有很多糊弄人的代码,给你弹个清理也不一定清理,但放心啊,正规网站都是有人审查代码,这不用担心,我们知道就行。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/46873.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

CP Process2

CP Process2 信贷流程&#xff0c;概念&#xff0c;分类&#xff0c;五级十二类

docker镜像命令容器命令

docker镜像命令 1、docker images //查看所有本地的主机上的镜像 2、docker search mysql //搜素镜像 2、docker pull mysql:5.7 //指定版本拉取mysql镜像 3、docker pull mysql //不指定版本拉取mysql镜像 4、docker rmi -f 镜像id //删除指定镜像 5、4、docker rmi -f 镜像…

基于高德地图实现Android定位功能实现(二)

基于高德地图实现Android定位功能实现&#xff08;二&#xff09; 在实现的高德地图的基本显示后&#xff0c;我们需要不断完善地图的功能 地图界面设计&#xff08;悬浮按钮等&#xff09; 首先就是地图页面的布局&#xff0c;这个根据大家的实际需求进行设计即可&#xff…

前后端数据交互设计到的跨域问题

前后端分离项目的跨域问题及解决办法 一、跨域简述 1、问题描述 这里前端vue项目的端口号为9000&#xff0c;后端springboot项目的端口号为8080 2、什么是跨域 当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域 当前页面url被请求页面url是否…

cuda缓存示意图

一、定义 cuda 缓存示意图gpu 架构示意图gpu 内存访问示意图 二、实现 cuda 缓存示意图 DRAM: 通常指的是GPU的显存&#xff0c;位于GPU芯片外部&#xff0c;通过某种接口&#xff08;如PCIE&#xff09;与GPU芯片相连。它是GPU访问的主要数据存储区域&#xff0c;用于存储大…

使用dnscat2 进行dns隧道反弹shell——直连模式linux对windows

直连模式&#xff1a;客户端直接向指定IP地址的DNS服务器发起DNS解析请求 环境搭建 搭建服务端 git clone https://github.com/iagox86/dnscat2.git cd dnscat2/server/ gem install bundler apt-get install ruby-dev bundle install 过程会有点慢 开启服务端 ruby ./dn…

二叉搜索树的实现[C++]

文章目录 搜索二叉树概念二叉搜索树的功能查找 实现搜索二叉树节点的定义建立搜索二叉树接口插入搜索打印删除 总结 今天本堂主来一起讨论下什么是搜索二叉树&#xff0c;和如何实现二叉搜索树 搜索二叉树 那么二叉搜索树似乎如何实现搜索呢&#xff1f;二叉搜索树和普通二叉…

linux 之时间子系统(八):hrtime 的实现机制

一、hrtimer 概述 在Linux内核中已经存在了一个管理定时器的通用框架。不过它也有很多不足&#xff0c;最大的问题是其精度不是很高。哪怕底层的定时事件设备精度再高&#xff0c;定时器层的分辨率只能达到Tick级别&#xff0c;按照内核配置选项的不同&#xff0c;在100Hz到10…

数据库管理1

数据库管理 数据库运维。 sql语句 数据库用来增删改查的语句 备份 数据库的数据进行备份 主从复制&#xff0c;读写分离&#xff0c;高可用。 数据库的概念和相关的语法和规范&#xff1a; 数据库&#xff1a;组织&#xff0c;存储&#xff0c;管理数据的仓库。 数据库的管理系…

一篇文章让你掌握计算网络的HTTP协议!!

HTTP 浏览器的服务原理http协议webTCP/IP协议族TCP/IP协议族分层应用层传输层网络层链路层数据包的封装过程HTTP数据传输过程传输层——TCP三次握手第一次握手第二次握手第三次握手三次握手的目的DNS域名解析HTTP完整事务处理过程HTTP协议的特点支持客户/服务器模式简短快速灵活…

钡铼Modbus TCP耦合器BL200实现现场设备与SCADA无缝对接

前言 深圳钡铼技术推出的Modbus TCP耦合器为SCADA系统与现场设备之间的连接提供了强大而灵活的解决方案&#xff0c;它不仅简化了设备接入的过程&#xff0c;还提升了数据传输的效率和可靠性&#xff0c;是工业自动化项目中不可或缺的关键设备。本文将从Modbus TC、SCADA的简要…

Apache网页优化(企业网站结构部署与优化)

本章结构 一、Apache网页优化 在使用 Apache 作为 Web 服务器的过程中&#xff0c;只有对 Apache 服务器进行适当的优化配置&#xff0c;才能让 Apache 发挥出更好的性能。反过来说&#xff0c;如果 Apache 的配置非常糟糕&#xff0c;Apache可能无法正常为我们服务。因此&…

Java8的新特性

Java8的新特性 一、函数式接口1、Java内置的函数式接口 二、Lambda表达式1、Lambda作用2、语法3、Lambda表达式的六种使用3.1、抽象方法&#xff1a;无参、无返回值3.2、抽象方法&#xff1a;需要传一个参数、无返回值3.3、抽象方法&#xff1a;需要传一个参数&#xff08;类型…

【iOS】OC类与对象的本质分析

目录 前言clang常用命令对象本质探索属性的本质对象的内存大小isa 指针探究 前言 OC 代码的底层实现都是 C/C代码&#xff0c;OC 的对象都是基于 C/C 的数据结构实现的&#xff0c;实际 OC 对象的本质就是结构体&#xff0c;那到底是一个怎样的结构体呢&#xff1f; clang常用…

IDEA实现SpringBoot项目的自打包自发布自部署

目录 前言 正文 操作背景 自发布 自部署 尾声 &#x1f52d; Hi,I’m Pleasure1234&#x1f331; I’m currently learning Vue.js,SpringBoot,Computer Security and so on.&#x1f46f; I’m studying in University of Nottingham Ningbo China&#x1f4eb; You can reach…

qt 创建一个左侧边线拖拽的矩形

1.概要 2.代码 2.1 代码第一版 在Qt中&#xff0c;要创建一个可以向左侧拖拽边线的矩形&#xff0c;你需要自定义一个QGraphicsRectItem的子类&#xff0c;并重写其事件处理函数来响应鼠标的拖拽动作。以下是一个简单的实现示例&#xff1a; #include <QApplication>…

设计模式——装饰者模式

设计模式——装饰者模式 1.问题1.1 方案一1.2 方案二 2.装饰者模式2.1 基本介绍2.2 结构2.3 代码实现 3.小结 1.问题 咖啡订单项目&#xff1a; 咖啡种类/单品咖啡:Espresso(意大利浓咖啡)、ShortBlack、LongBlack(美式咖啡)、Decaf(无因咖啡)调料:Milk、Soy(豆浆)、Chocolat…

GB35114控制信令认证流程

GB35114控制信令认证说明&#xff1a; 注册成功后,信令发送方与信令接收方进行交互时,采用基于带密钥的杂凑方式保障信令来源安 全&#xff61;对除REGISTER消息以外的消息做带密钥的杂凑&#xff61;启用Date字段,扩展信令消息头域,在头域中 增加 Note 字 段 (值 为 Digest…

项目经理到底要不要考PMP?

在接待PMP学员中我惊讶地发现&#xff0c;不仅是项目经理&#xff0c;连开发、测试、产品、运营、销售、甚至财务团队的朋友们也都在积极备考。他们考证的原因主要有这几点&#xff1a; 1&#xff0c;职业发展&#xff1a;希望在职业生涯中晋升或转型到项目管理角色的朋友来说…