资讯专栏INFORMATION COLUMN

上云采购季！| 2核2G4M爆款云服务器低至59元/年，更有多台、长期优惠，快来选购！

立即前往
首页/文章专栏/JS基础入门篇（ 二 ）—if ， 字符串拼接，数组，图片循环切换

JS基础入门篇（ 二 ）—if ， 字符串拼接，数组，图片循环切换

MudOnTire / 2785人阅读

摘要：错误，因为取到的是字符串，相加会造成字符串拼接。强制转换，将字符串类型转成数字类型。以上代码结果为解释和获取到的是字符串，当字符串相加时，会直接拼接字符串。表示数组的线长度。重新定义数组长度，后面个数组的值都为图片切换两张图片切换。

1.if篇

1. if

语法:

    if( 判断条件 ){
        代码块
    }
    以上代码的功能是：
        如果 判断条件为真
            则 执行代码块

2. if-else

语法:

    if( 判断条件 ){
        代码1
    }else{
        代码2
    }
    上面的 语句 实现的功能:
        如果判断条件成立 ( 为真 )
            执行 代码1
        否则
            执行 代码2

3. if-else-if-else

语法:

    if( 判断条件1 ){
        代码1
    }else if（ 判断条件2 ）{
        代码2
    }else if（ 判断条件3 ）{
        代码3
    }...
    else{
        代码
    }
    上面的 语句 实现的功能:
        如果判断条件几成立 ( 为真 )
            执行 代码几
        否则（如果以上都不成立）
            执行 代码（就是else里面的代码）
2.字符串

字符串：用 成对的 单引号或者双引号包起来的 0个或多个字符组成的串。

    var userName = "kimoo";//字符串为kimoo
    var userName = "";//空字符串
    var userName = " ";//一个由空格组成的字符串
    var userName = "kimoo"";//字符串为kimoo"
    var userName = "kimoo"";//字符串为kimoo"

字符串拼接：用 + 做字符串拼接。只要加号一边是字符串，另一边是数字，那么会把数字转变成字符串然后做拼接，只有加号两边都是数字才会做数字加法。

以上代码结果为：

举例说明：错误的计算器

以下代码的作用是：实现数字相加，计算出相加结果的功能。




    
    <span class="javascript">Title</span>

以上代码结果为：

解释：t1.value 和 t2.value获取到的是字符串，当字符串相加时，会直接拼接字符串。如果需要计算数字相加，可以将字符串强转为数字。

alert(Number(one)+Number(two));

这样可以实现我们想要的功能，实现数字相加。

3.数组

数组：存储一组数据。

定义数组：举例：var a = ["a","b","c"];

用[ ]

多个数据之间用 ,（逗号）隔开，最后一个数据后面不用加逗号。

数组的取值：使用下标，注意下标是从0开始的。eg：a[0], a[1], a[2]

数组的长度:
数组.length（可读 可写）。eg: a.length表示数组a的线长度。

清空数组的两种方法

方法1-为变量重新赋值
   arr = [];
方法2-arr.length = 0;
4.图片切换

1.两张图片切换。codepen不方便放图片，故用颜色代替。
点击方框会切换颜色




    
    <span class="javascript">Title</span>

2.多组颜色切换
循环切换图片,点击查看效果！！！！！

  2.     
  3.     Title
  4.
云服务器 GPU云服务器 js图片循环切换效果 ie js if循环 js循环取出数组 js图片切换

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/52350.html

相关文章

  • JS基础入门篇（ 二 ）—if ， 字符串拼接，数组，图片循环切换

    摘要：错误，因为取到的是字符串，相加会造成字符串拼接。强制转换，将字符串类型转成数字类型。以上代码结果为解释和获取到的是字符串，当字符串相加时，会直接拼接字符串。表示数组的线长度。重新定义数组长度，后面个数组的值都为图片切换两张图片切换。 1.if篇 1. if 语法: if( 判断条件 ){ 代码块 } 以上代码的功能是： 如果 判断...

    betacat 评论0 收藏0

  • JS基础入门篇（ 二 ）—if ， 字符串拼接，数组，图片循环切换

    摘要：错误，因为取到的是字符串，相加会造成字符串拼接。强制转换，将字符串类型转成数字类型。以上代码结果为解释和获取到的是字符串，当字符串相加时，会直接拼接字符串。表示数组的线长度。重新定义数组长度，后面个数组的值都为图片切换两张图片切换。 1.if篇 1. if 语法: if( 判断条件 ){ 代码块 } 以上代码的功能是： 如果 判断...

    yhaolpz 评论0 收藏0

  • 【连载】前端个人文章整理-从基础到入门

    摘要：个人前端文章整理从最开始萌生写文章的想法，到着手开始写，再到现在已经一年的时间了，由于工作比较忙，更新缓慢，后面还是会继更新，现将已经写好的文章整理一个目录，方便更多的小伙伴去学习。 showImg(https://segmentfault.com/img/remote/1460000017490740?w=1920&h=1080); 个人前端文章整理 从最开始萌生写文章的想法，到着手...

    madthumb 评论0 收藏0

  • JavaScript 基础知识 - DOM篇(一)

    摘要：前言本篇文章是基础知识的篇，如果前面的基础知识入门篇看完了，现在就可以学习了。基本概念分为三个部分。在这个基础上使用一些新特性，高级浏览器支持，低级浏览器不支持。在对象中的属性是一个布尔值，只有和。 showImg(https://segmentfault.com/img/remote/1460000012581493?w=1920&h=1080); DOM 前言 本篇文章是JavaS...

    cuieney 评论0 收藏0

发表评论

登陆后可评论

0条评论

MudOnTire

男|高级讲师
我要私信

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<