实训学习日志day1——6.17

201711671206 高颖 信管1172

笔记:

html  超文本标记语言

新建一个文件夹,直接把文件夹拉入到sublime text3

在sublime里面 右键-新建文件

给新文件命名,带html文件后缀,ctrl+s 保存文件

在创建的新html文件中 输入 html 按tab键可以补齐代码


html文档的结构
<!DOCTYPE html>
<html>
<!-- 头部 -->
<head>
    <meta charset="utf-8"> 
    <title></title>
    <!-- 样式 -->
    <style type="text/css"></style>
</head>

    <!-- 身体 -->
    <body>
        
        <!-- 行为 -->
        <script type="text/javascript"></script>
    </body>
</html>

——————————————————————————————————————————————————————

1.通过js获取输入框中的vlaue值

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>获取输入框的值</title>
<script type="text/javascript">
window.οnlοad=function(){
var bt=document.getElementById("bt2");
var btt=document.getElementById("bt1");
bt.οnclick=function(){
alert(bt1.value);
}
}
</script>
</head>
<body>
请输入内容<input type="text" id="bt1" /><br>
<input type="button" id="bt2" value="获取输入数据" />

</body>
</html>

2.点击某个元素,更改该元素的样式

day1question2.<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
    <title>js实现点击按钮变换背景颜色</title>
<script type="text/javascript">function aa(){document.bgColor="Orange";}function change(c){document.bgColor=c;}
</script>
</head>
<body οnlοad="aa()">
<input type="button" value="橙色" οnclick="change('Orange')"/>
<input type="button" value="粉色" οnclick="change('pink')"/>
<input type="button" value="绿色" οnclick="change('green')"/>
<br />
<br/>
</body>
</html>

3.互换变量值


<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>不引入第三个变量来对换值</title>
</head>
<body>

    <script type="text/javascript">
        //文档加载完成
        window.onload = function(){
            var a = 8;
            var b = 2;
                console.log("a的值为",a);                        
                  console.log("b的值为",b);                                                
            a=a+b;
            b=a-b;
            a=a-b;
            console.log("a,b互换后:");
            console.log("a的值为",a);                                                                                    
            console.log("b的值为",b);
        }
    </script>
</body>
</html>

4.乘法口诀

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<script type="text/javascript">
var i , j;
            for(i = 1;i <= 9;i ++){
                document.write("<br>");               // i 为行的乘数,j 为列数  每一行打印完后换行
                for(j = 1;j <= i;j ++){
                    sum = i * j;
                    document.write(i+"×"+j+"="+sum+" "+" ");
                }
            }
</script>
</body>
</html>

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值