js-000000000000

 1、js书写的位置 - 内部

<body>


 

  <!-- 习惯把 js 放到 /body 的后面 -->

  <script>

    console.log('这是内部 js 的书写位置')

    alert('内部js')

  </script>

</body>

<body>


  <!-- 习惯把 js 放到 /body 的后面 -->
  <script>
    console.log('这是内部 js 的书写位置')
    alert('内部js')
  </script>

</body>

 

2、js书写的位置 - 外部

<body>

  <!-- script src= -->
  <!-- 如果写了 src 引入了单独的 js 文件,script 中间不要再放代码(会被忽略) -->
  <script src="./my.js">
    alert('我是script src 中间的代码,会被忽略')
  </script>
</body>

3、js书写的位置 - 行内

<body>

  <!-- vue 好多行内 js -->
  <button onclick="alert('hi')">按钮</button>
</body>

4、js注释和结束符

  <script>

    // 单行注释

    /* 块注释
       可换行
    */

    ; 结束符
  </script>

5、js输出语句

document.querySelector('h1').innerHTML = '我是js设置的内容'

找到了就能控制,找不到返回null

6、js输入语句 - prompt

  <script>
    // 确定 - 保存用户输入的数据到变量
    // 取消 - null

    let name = prompt('请输入用户名:')
    console.log(name)    
  </script>

    // 确定 - 保存用户输入的数据到变量

    // 取消 - null

7、变量let、常量const、变量var?

8、交换变量值

  <script>
    let num1 = 10
    let num2 = 20
    console.log(num1,num2)  // 10 20

    // 临时变量 做中间过渡
    let temp
    temp = num1
    num1 = num2
    num2 = temp
    console.log(num1,num2)  // 20 10
  </script>

9、数据类型

  <script>
    let num1 = 10
    console.log(typeof num1)  // number

    let name = '小红'
    console.log(typeof name)  // string

    let isLogin = true
    console.log(typeof isLogin)  // boolean

    let num100
    console.log(typeof num100)  // undefined

    let num200 = null
    console.log(typeof num200)  // object
    // 倒计时发验证码 用定时器 -> 类型是对象类型 -> 用变量保存才能清除定时器    
    
  </script>

倒计时发验证码 用 定时器 → 类型是对象型 → 用变量保存才能清除定时器

10、拼接字符串,+ 和 模版字符串

  <script>
    // 输入年龄数字,控制台输出“我今年xx岁了”
    let age = prompt('你的年龄')
    console.log(`我今年${age}岁了`)
    console.log('我今年'+age+'岁了')
  </script>

11、算术运算符

  <script>
    let num1 = 9
    let num2 = 2

    console.log(num1 + num2)  // 11
    console.log(num1 - num2)  // 7
    console.log(num1 * num2)  // 18
    console.log(num1 / num2)  // 4.5
    // 判断是否整除
    console.log(num1 % num2)  // 1   
    
  </script>

12、赋值运算符?

+=,-=

13、总结表

2.1、自增自减运算符

  <script>
    // 自增:先算数再加法运算
    let num = 5
    // num++
    // ++num
    console.log(num)

    // ++ 在后:先运算,再自增
    // let res = num++
    // console.log(num,res) // 6 , 5

    // ++ 在前:先自增,再运算
    let res = ++num
    console.log(num, res) // 6 , 6

  </script>

2.2、比较运算符

  <script>
        console.log(3 != '3')   // false
        console.log(3 !== '3')  // true    
  </script>

== 只判断数值是否相等

=== 既判断类型又判断数值 是否相等

2.3、逻辑运算符

  <script>
    // 取反
    console.log(!false) // true

    // &&: 都真才真
    // && : 遇到false后面的不执行,输出前面的值
    console.log(3 > 5 && 5 < 10)  // false
    console.log(0 && 10)  // 0
    console.log(1 && 10)  // 10

    // || : 遇到true后面的不执行
    console.log(3 < 5 || 5 > 10)  // true
    console.log(3 || 0) // 3
    console.log(0 || 3) // 3

  </script>

2.4、类型转换转数字

  <script>
    let num1 = '6'
    let num2 = '6.6'
    let x = '66px'

    // 保留小数转换
    console.log(parseFloat(num1)) // 6
    console.log(parseFloat(num2)) // 6.6
    console.log(parseFloat(x))    // 66

    // 取整转换
    console.log(parseInt(num1)) // 6
    console.log(parseInt(num2)) // 6
    console.log(parseInt(x))    // 66

    console.log(typeof Number(num1))  // number
    console.log(typeof Number(num2))  // number
    console.log(typeof Number(x))     // number
    
  </script>

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Android笔记(四十):ViewPager2嵌套RecyclerView滑动冲突进一步解决

背景 ViewPager2内嵌套横向滑动的RecyclerView&#xff0c;会有滑动冲突的情况&#xff0c;引入官方提供的NestedScrollableHost类可以解决冲突问题&#xff0c;但是有一些瑕疵&#xff0c;滑动横向RecyclerView到顶部&#xff0c;按住它不放手继续往左拖再往右拖&#xff0c;这…

Taro小程序开发性能优化实践

我们团队在利用Taro进行秒送频道小程序的同时&#xff0c;一直在探索性能优化的最佳实践。随着需求的不断迭代&#xff0c;项目中的性能问题难免日积月累&#xff0c;逐渐暴露出来影响用户体验。适逢双十一大促&#xff0c;我们趁着这个机会统一进行了Taro性能优化实践&#xf…

jangow-01-1.0.1靶机

靶机 ip&#xff1a;192.168.152.155 把靶机的网络模式调成和攻击机kali一样的网络模式&#xff0c;我的kali是NAT模式, 在系统启动时(长按shift键)直到显示以下界面 ,我们选第二个&#xff0c;按回车。 继续选择第二个&#xff0c;这次按 e 进入编辑页面 接下来&#xff0c;…

03.HTTPS的实现原理-HTTPS的工作流程

03.HTTPS的实现原理-HTTPS的工作流程 简介1. HTTPS的工作流程1.1. TCP的工作流程1.1.1. 三次握手的详细步骤1.1.2. 三次握手的作用 1.2. HTTPS的工作流程1.2.1. HTTPS与TCP的关系1.2.2. HTTPS的工作流程 2. 公钥和私钥的作用3. 对称密钥的生成和交换4. 对称加密和非对称加密的区…

阿里云人工智能ACA(五)——深度学习基础

一、深度学习概述 1. 深度学习概念 1-1. 深度学习基本概念 深度学习是机器学习的一个分支基于人工神经网络&#xff08;模仿人脑结构&#xff09;通过多层网络自动学习特征能够处理复杂的模式识别问题 1-2. 深度学习的优点与缺点 优点 强大的特征学习能力可以处理复杂问题…

MySQL和HBase的对比

Mysql &#xff1a;关系型数据库&#xff0c;主要面向 OLTP &#xff0c;支持事务&#xff0c;支持二级索引&#xff0c;支持 sql &#xff0c;支持主从、 Group Replication 架构模型&#xff08;此处以 Innodb 为例&#xff0c;不涉及别的存储引擎&#xff09;。 HBase &am…

Ftrans数据摆渡系统 搭建安全便捷跨网文件传输通道

一、专业数据摆渡系统对企业的意义 专业的数据摆渡系统对企业具有重要意义&#xff0c;主要体现在以下几个方面‌&#xff1a; 1、‌数据安全性‌&#xff1a;数据摆渡系统通过加密传输、访问控制和审计日志等功能&#xff0c;确保数据在传输和存储过程中的安全性。 2、‌高…

FPGA的DMA应用——pcileech

硬件通过pcie总线&#xff0c;访存本机的内存&#xff0c;并进行修改&#xff0c;可以进行很多操作。 学习视频&#xff1a;乱讲DMA及TLP 1-pcileech项目简介和自定义模块介绍_哔哩哔哩_bilibili vivado2024.1的下载文章链接和地址&#xff1a;AMD-Xilinx Vivado™ 2024.1 现…

未来网络技术的新征程:5G、物联网与边缘计算(10/10)

一、5G 网络&#xff1a;引领未来通信新潮流 &#xff08;一&#xff09;5G 网络的特点 高速率&#xff1a;5G 依托良好技术架构&#xff0c;提供更高的网络速度&#xff0c;峰值要求不低于 20Gb/s&#xff0c;下载速度最高达 10Gbps。相比 4G 网络&#xff0c;5G 的基站速度…

一种寻路的应用

应用背景 利用长途车进行货物转运的寻路计算。例如从深圳到大连。可以走有很多条长途车的路线。需要根据需求计算出最合适路线。不同的路线的总里程数、总价、需要的时间不一样。客户根据需求进行选择。主要有一些细节&#xff1a; 全国的长途车车站的数据的更新&#xff1a; …

STL格式转换为GLTF格式

STL与GLTF格式简介 STL格式 STL&#xff08;Stereo Lithography&#xff09;文件是一种广泛使用的3D打印文件格式&#xff0c;由3D Systems公司开发。它主要用于存储三维物体的几何信息&#xff0c;常用于立体光刻等3D打印技术。STL文件通常只包含物体的表面几何形状&#xf…

DevOps实战:用Kubernetes和Argo打造自动化CI/CD流程(1)

DevOps实战&#xff1a;用Kubernetes和Argo打造自动化CI/CD流程&#xff08;1&#xff09; 架构 架构图 本设计方案的目标是在一台阿里云ECS服务器上搭建一个轻量级的Kubernetes服务k3s节点&#xff0c;并基于Argo搭建一套完整的DevOps CI/CD服务平台&#xff0c;包括Argo CD…

数据结构经典算法总复习(下卷)

第五章:树和二叉树 先序遍历二叉树的非递归算法。 void PreOrderTraverse(BiTree T, void (*Visit)(TElemType)) {//表示用于查找的函数的指针Stack S; BiTree p T;InitStack(S);//S模拟工作栈while (p || !StackEmpty(S)) {//S为空且下一个结点为空&#xff0c;意味着结束遍…

前端知识补充—CSS

CSS介绍 什么是CSS CSS(Cascading Style Sheet)&#xff0c;层叠样式表, ⽤于控制⻚⾯的样式 CSS 能够对⽹⻚中元素位置的排版进⾏像素级精确控制, 实现美化⻚⾯的效果. 能够做到⻚⾯的样式和结构分离 基本语法规范 选择器 {⼀条/N条声明} 1&#xff09;选择器决定针对谁修改…

Spring Security 6 系列之九 - 集成JWT

之所以想写这一系列&#xff0c;是因为之前工作过程中使用Spring Security&#xff0c;但当时基于spring-boot 2.3.x&#xff0c;其默认的Spring Security是5.3.x。之后新项目升级到了spring-boot 3.3.0&#xff0c;结果一看Spring Security也升级为6.3.0&#xff0c;关键是其风…

【Go】context标准库

文章目录 1. 概述1.1 什么是 Context1.2 设计原理1.3 使用场景1.4 Context 分类核心:Context接口2. 源码解读4个实现emptyCtxTODO 和 BackgroundcancelCtxWithCancelcancelCtx.propagateCancel 构建父子关联parentCancelCtx 获取父上下文中的内嵌cancelCtxcanceltimerCtxWithT…

Windows和Linux安全配置和加固

一.A模块基础设施设置/安全加固 A-1.登录加固 1.密码策略 a.最小密码长度不少于8个字符&#xff0c;将密码长度最小值的属性配置界面截图。 练习用的WindowsServer2008,系统左下角开始 > 管理工具 > 本地安全策略 > 账户策略 > 密码策略 > 密码最小长度&#…

webrtc-internals调试工具

Google 的 Chrome&#xff08;87 或更高版本&#xff09;WebRTC 内部工具是一套内置于 Chrome 浏览器中的调试工具; webrtc-internals 能够查看有关视频和音频轨道、使用的编解码器以及流的一般质量的详细信息。这些知识对于解决音频和视频质量差的问题非常有帮助。 webrtc-int…

MT6765核心板_MTK6765安卓核心板规格参数_联发科MTK模块开发

MTK6765安卓核心板是基于联发科高效八核处理器平台开发的一款强大硬件解决方案。这款核心板的核心是采用12纳米工艺打造的MTK6765 CPU&#xff0c;具备四个主频高达2.3GHz的CORTEX-A53核心和四个主频为1.8GHz的CORTEX-A53核心&#xff0c;提供了卓越的处理性能。用户可以根据需…

Linux Shell 脚本编程基础知识篇—shell 运算命令详解

ℹ️大家好&#xff0c;我是练小杰&#xff0c;本文继续Linux shell脚本编程的基础知识内容&#xff0c;接着讲算术运算命令的详细操作~~ 复习&#xff1a;【shell简介以及基本操作】 更多Linux 相关内容请点击&#x1f449;“Linux专栏”~ 文章目录 let运算命令的用法let 的高…