JavaScript--属性操作读写.字符串拼接以及if语句

属性操作读写

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <!--
        属性操作
            属性
                在标签中设置属性 方法: 属性名="属性值"
                在css中设置属性 方法: 属性名:属性值;
    -->
    <input type="text" value="" id="btn1">
    <input type="button" value="走起" id="btn2">
    <br>
    <img src="img/2.jpg" width="200px" height="300px" alt="卡通" id="img1">
</body>
</html>
<script type="text/javascript">
    var a = 1;
    var b = "hello";
    alert(1+a);
    alert(b+" world");
    var oBtn1 = document.getElementById("btn1");
    var oBtn2 = document.getElementById("btn2");
    var oImg = document.getElementById("img1");

    oBtn2.onclick = function(){
        //alert(oBtn1.value);
        //oImg.src = "img/1.jpg";
        oImg.src = oBtn1.value;
        //oBtn1.value = "五五开";
    }
</script>

效果

alert(1+a);
alert(b+" world");

这里写图片描述
这里写图片描述


oImg.src = oBtn1.value;

这里写图片描述
这里写图片描述


字符串拼接以及if语句

这里写代码片<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <input type="text" value="" id="btn1">
    <input type="button" value="走起" id="btn2">
    <br>
    <img src="img/2.jpg" width="200px" height="300px" alt="卡通" id="img1">
</body>
</html>
<script type="text/javascript">

    var oBtn1 = document.getElementById("btn1");
    var oBtn2 = document.getElementById("btn2");
    var oImg = document.getElementById("img1");
    var a = 1;
    oBtn2.onclick = function(){
        if(a > 3)
            a = 1;
        oImg.src = "img/"+a+".jpg";
        a++;
    }
</script>
因为img文件夹下只有三个图片,所以用if判断,当a>3的时候将其重置为1
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值