前情提要:

　　　　利用html 和css ,js 模拟小米的官网(待做)

　　　　一:第一个sj利子

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script>

        // <!--编写js代码-->

        document.write('<h1>hello world</h1>')

    //    把网页发送到网页上

        alert('hello python')

    //    弹出提示框

    </script>

    <style>

        h1{

            color: red;

        }

    </style>

</head>

<body>

<script>

    document.write('<h1>hello java</h1>')

</script>

</body>

</html>

<script>

    document.write('<h1>hello golang</h1>')

</script>

　　　　二:引入外部js文件

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <!--<script type="text/javascript" src="d.js">-->

    <!--或者-->

    <script  src="d.js" async>

    </script>

</head>

<body>

<input type="button" value="click me" onclick="alert(11)">

</body>

</html>
alert("hello wold")

　　　　三:定义变量

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script>

        var aa = '早乙女';

        var bb = 10.5;

        var cc = true;

        dd = 10;

        alert(aa);

        alert(bb);

        alert(cc);

        alert(dd);

    </script>

</head>

<body>

</body>

</html>

　　　　四:运算符号

　　　　五:条件判断

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script>

        var aa=[40];

        if (aa>60){

            document.write("<p>优秀</p>")

        }

        else if(aa>50){

            document.write("<p>及格</p>")

        }

        else {

            document.write("<p>不及格</p>")

        }

    </script>

</head>

<body>

</body>

</html>

　　　　六:条件判断2

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script>

        // <!--根据需求生成星期几-->

        var aa=2;

        switch (aa){

            case 1:{

                document.write('这是星期1')

            }

            break;

            case 2:{

                document.write('这是星期2')

            }

            break;

            case 3:{

                document.write('这是星期3')

            }

            break;

            default:{

                document.write('没这个新奇')

            }break;

        }

    </script>

</head>

<body>

</body>

</html>

　　　　七:循环

一:

二:

三:

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

<script>

    // <!--while 循环条件写在前面-->

    // <!--输出1~10的和-->

    // var num =0;

    // var sun =0;

    // while (num<10){

    //     sun =sun+num;

    //     num++;

    // }

    // alert(sun)

//    do while 循环

//    计算1~10 内的奇数和

//     var num =0;

//     var sun =0;

//     do{

//         if (num%2==1){

//             sun=sun+num;

//         }

//         num=num+1;

//     }while (num<10)

// alert(sun)

//    计算1~10 的偶数相加

    var sun =0;

    for (var num =1;num<=10;num++){

        if (num%2==0){

            sun=sun+num;

        }

    }

    alert(sun)

</script>

</head>

<body>

</body>

</html>

　　　　

八:循环案例

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

<script>

    // <!--生成一个三角形-->

    for (var i=1;i<=6;i++){

    //    生成空格数量

        var spnum =6-i;

        for(var col=1;col<=spnum;col++){

            document.write('&nbsp;');

        }

        var srnum =2*i-1;

        for (var nol=1;nol<=srnum;nol++){

            document.write("*")

        }

        document.write("<br/>")

    }

</script>

</head>

<body>

</body>

</html>

day 32 css后续补充以及js 简单入门的更多相关文章

  1. EChart.js 简单入门

    EChart.js 简单入门 最近有一个统计的项目要做,在前端的数据需要用图表的形式展示.网上搜索了一下,发现有几种统计图库. MSChart   这个是Visual Studio里的自带控件,使用比 ...

  2. JS简单入门教程

    JS简单教程 使用方法:放到任意html页面的head标签下 Test1方法弹出当前时间对话框 Test2方法for循环输出 Test3方法for(…in…)输出数组内容 <script typ ...

  3. css属性补充与JS数据类型

    目录 溢出属性(overflow) 定位(position) z-index属性 opacity不透明度 JavaScript简介 变量与注释 数据类型 数值(Number) 字符串(String) ...

  4. [转]Backbone.js简单入门范例

    本文转自:http://dmyz.org/archives/598 11年刚开始用前端MVC框架时写过一篇文章,当时Knockout和Backbone都在用,但之后的项目全是在用Backbone,主要 ...

  5. anime.js 简单入门教程

    anime.js是一个强大的用来制作动画的javascript库,虽然功能没有GASP(greensock)强大,但胜在它足够轻便,gzip压缩完只有9kb左右,麻雀虽小,却五脏俱全. 下面就来看看如 ...

  6. angular.js简单入门。

    小弟刚接触angular js  就写了一个简单的入门.后续慢慢补... 首先看 html 页面. <html> <meta charset="UTF-8"> ...

  7. JS简单入门

    ------------恢复内容开始------------ JavaScript,可以减少网页的规模,提高网页的浏览速度,丰富页面的表现和功能 HTML是进行基本结构的创建的,比如说表格和表单等, ...

  8. 98、vue.js简单入门

    本篇导航: 介绍与安装 vue常用指令 一.介绍与安装 vue是一套构建用户界面的JAVASCRIPT框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层, ...

  9. 13、vue.js简单入门

    本篇导航: 介绍与安装 vue常用指令 一.介绍与安装 vue是一套构建用户界面的JAVASCRIPT框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层, ...

随机推荐

  1. c++日志练习

    使用ostream流创建写入log日志文件 使用宏 配置文件大小和间隔时间  当创建文件时间间隔或文件大小大于指定数字 则创建新文件 文件名由时间自动命名 /********************* ...

  2. sqlserver将数据库的数据导成excel文档方法

    sqlserver将数据库的数据导成excel文档方法 最近公司需要下载uniport的数据跟之前的数据进行对比,所以避免不了需要将数据库的数据导出来,把SQLServer表中的数据导出为Excel文 ...

  3. 2018.09.08 NOIP模拟 division（状压dp）

    这么sb的题考场居然写挂了2233. 假设n=∏iaiki" role="presentation" style="position: relative;&qu ...

  4. HDU 1106 排序 （排序+处理字符串）

    题意:略. 析:按照题目说的,把字符串分割,然后把字符串转成十进制,存起来,可以用数组,我用的向量, 排序一下就OK了.注意的是,要考虑多个5相邻的时候,刚开始没考虑WA了一次. 代码如下: #inc ...

  5. Python初学者的捷径[译]

    下面列出的都是这些年总结的Python的有用的知识点和一些工具.希望对你有所帮助! 交换变量值 x = 6 y = 5 x, y = y, x print x >>> 5 print ...

  6. HDU6023 Automatic Judge 2017-05-07 18:30 73人阅读 评论(0) 收藏

    Automatic Judge Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 131072/131072 K (Java/Others ...

  7. Hdu428 漫步校园 2017-01-18 17:43 88人阅读 评论(0) 收藏

    漫步校园 Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 65536/32768K (Java/Other) Total Submissi ...

  8. underscore objects

    1._.keys():获取对象的属性名,不包含原型链 _.keys = nativeKeys || function(obj) { if (obj !== Object(obj)) throw new ...

  9. 提高Android和iOS调试编译速度

    http://www.cnblogs.com/findumars/p/7841252.html 提高Android和iOS调试编译速度   如果您使用Delphi开发App,就会遇到:Android和 ...

  10. XML字符串反序列化为实体

    JSON反序列化实体 paydata = StringHelper.Base64ToString(paydata); resInfo = JsonConvert.DeserializeObject&l ...