侧边栏

前端学习阶段性练习题

1.在浏览器的控制台中打印九九乘法表

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

 

</body>

<script type="text/javascript">

        var str='';   // 1*1=1\t\n2*1=2\t2*2=4\t

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

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

                str+=i+'*'+j+'='+(i*j)+'\t';

            }

            str+='\n';

        }

        console.log(str);  //控制台打印

</script>

</html>
View Code

2. 在浏览器的控制台中打印等边三角形

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

 

</body>

 

<script type="text/javascript">

var index=11;   //行数必须是奇数

        var str='';    

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

            //加入空格

            for(var j=0;j<index-i;j++){

                str+=' ';

            }

            //加入星星

            for(var x=0;x<2*i-1;x++){

                str+='*';

            }

            //加入换行

            str+='\n';    

        }

        console.log(str);

</script>

 

</html>
View Code

3. 统计1900-2018年的总天数

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

 

</body>

<script type="text/javascript">

        var sum=0;

        for(var i=1900;i<=2018;i++){

            if(i%400==0||(i%4==0&&i%100!=0)){

                sum+=366;

            }

            else{

                sum+=365;

            }

        }

        alert(sum);

</script>

</html>
View Code

4. 在网页中某2个文本框中输入要查询的年份和月份,求出对应的该月总天数

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

     <label>请输入年份:</label>

     <input id="year" type="text"/>

     <label>请输入月份:</label>

     <input id="month" type="text"/>

     <input id="but" type="button" value="开始计算"/></body><script type="text/javascript">         

         var yearNode=document.getElementById('year');

         var monthNode=document.getElementById('month');

         var buttonNode=document.getElementById('but');

         buttonNode.onclick=function(){

             //获取用户输入的年份和月份

             var year=yearNode.value;

             var month=monthNode.value;

             month=parseInt(month);

             switch(month){

                   //大月

                   case 1:

                   case 3:

                   case 5:

                   case 7:

                   case 8:

                   case 10:

                   case 12:

                       alert(year+'年'+month+'月有31天');

                       break;

                   //小月       

                   case 4:

                   case 6:

                   case 9:;

                   case 11:

                       alert(year+'年'+month+'月有30天');

                       break;

                   //二月

                   case 2:

                       if(year%400==0||(year%4==0&&year%100!=0)){

                           alert(year+'年'+month+'月有29天');

                       }

                       else{

                           alert(year+'年'+month+'月有28天');

                       }

                       break;

                   default:

                       alert('您输入的月份压根不存在');    

             }

         };

         </script>

</html>
View Code

5. 请将字符串"安徽省.合肥市.xxx.xxx"分割成数组.

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

 

</body>

 

<script type="text/javascript">

 var person=new String('安徽省’.’合肥市’.’高新区’.’浮山路');

        

        var arr=person.split('.');

        

        for(index in arr){

            console.log(   arr[index]  );

        }

</script>

</html>
View Code

6.截取字符串

"游戏的目的是用来体会JavaScript高级语法的使用不需要具备抽象对象的能力，使用面向对象的方式分析问题，需要一个漫长的过程。"  截取其中的"使用面向对象的方式分析问题"这句话。

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

 

</body>

 

<script type="text/javascript">

 var path='游戏的目的是用来体会JavaScript高级语法的使用不需要具备抽象对象的能力，使用面向对象的方式分析问题，需要一个漫长的过程。';

path=path.substring(41,54);

alert(path);

</script>

</html>
View Code

7.JS中原始数据类型分为哪几种?

6种原始数据类型：

  • Boolean: 布尔表示一个逻辑实体，可以有两个值：true 和 false
  • Number: 用于表示数字类型
  • String: 用于表示文本数据
  • Null: Null 类型只有一个值： null,特指对象的值未设置
  • Undefined: 一个没有被赋值的变量会有个默认值 undefined
  • Symbol: 符号(Symbols)是ECMAScript第6版新定义的。符号类型是唯一的并且是不可修

8.JS中有哪些常见的内置对象?

(1)Number (2)Boolean (3)String  (4)Array (5)Data (6)Math (7)RegExp

9.怎么将string/number转换成boolean？

强制转换

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

 

</body>

 

<script type="text/javascript">

var str1="";

        var str2="true";

        var str3="xxxxxxxx";

        str1=Boolean(str1);

        alert(str1);

 

        str2=Boolean(str2);

        alert(str2);

        

        str3=Boolean(str3);

        alert(str3);

 

        

        var num1=0;

        var num2=123;

        var num3=3.1415;

        

        alert(  Boolean(num1)   );

        alert(  Boolean(num2)   );

        alert(  Boolean(num3)   );

 

 

</script>

 

</html>
View Code

10.求出所有的水仙花数？

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

 

</body>

 

<script type="text/javascript">

  //求出所有的水仙花数

       //1.水仙花数是三位数

       //2.ABC   A*A*A+B*B*B+C*C*C==ABC

       //  798

       

       for(var num=100;num<1000;num++){

           var A=parseInt(num/100);

           var B=parseInt(num/10)%10;

           var C=num%10;

           if(A*A*A+B*B*B+C*C*C==num){

               console.log(num);

           }

       }


</script>


</html>
View Code

11. 随机定义一个number类型的数组,请求出该数组中的最大数字,以及最大数字出现的次数。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Insert title here</title>
</head>
<body>

</body>

<script type="text/javascript">

var arr3=new Array(10,20,30,40,50);

num = arr3.sort();
num.reverse();

//alert(num.length)

 console.log(num[0]);
 var j=0;
for(var i = 0;i<=num.length;i++){
    if(num[i]==num[0]){
        j++;
    }
}
console.log(j);
</script>
</html>
View Code

12.请打印[0,100]中所有的偶数.

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

 

</body>

 

<script type="text/javascript">

       var num=1;

       while(num<=100){

           if(num%2==0){

               console.log('数字:  '+num);

           }

           num++;

</script>

</html>
View Code

13.请打印出[1949~至今]所有的闰年。

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

 

</body>

 

<script type="text/javascript">

var year=1949;
      while(year<=2019&&year>=1949){
       if( year%400==0  || (year%4==0&&year%100!=0) ){
       console.log('年份:  '+year);
       }
       year++;
      }

console.log(year);

 

</script>

 

</html>
View Code

14.CSS代码插入HTML的三种方式分别是？

插入方式一：内嵌样式

插入方式二：内部样式

插入方式三：外部样式

15.CSS的选择器有哪些？

（1）基本选择器

（2）属性选择器

（3）伪元素选择器

（4）层级选择器

16.在表单中input标签中的type属性有哪些？

(1 text

(2 password

(3 radio

(4 checkbox

(5 button

(6 submit

(7 reset

(8 image

(9 file

(10 hidden

17.JS代码插入的方式有哪几种？

（1  内嵌JS代码

（２内部JS代码

（3 外部JS代码　

18.请用冒泡算法对下列数组进行排序,使用js代码实现.

   [22,32,12,11,98,14]

  var nums=[22,32,12,11,98,14];

        nums.sort();

        alert(nums);

19.请将下列数组的顺序调转,要求不能调用方法,自己使用js代码实现.

   [10，20，30，40，50]

function arrReverse(arr){        //function 封装函数   arrReverse函数名称
          var newArr=[];           //新建多个空数组
          var b=[];
          var c=[];
          
          //for循环    arr.length获取长度（arr参数名称length获取参数长度）
          for(var i=0;i<arr.length;i++){ 
            var c = arr[i];
            var b = newArr.unshift(c);
            console.log(newArr);//控制台打印输出newArr 检测是否思路正确
          }
          return arr = newArr;//将newArr的值返回给arr
      }
     document.write(arrReverse([10,20,30,40,50]));

20.请使用以下格式打印当前的时间信息：

   当前时间: 2019/9/24/9:00  星期2

<script type="text/javascript">
//当前时间: 2019/9/24/9:00  星期2

var date=new Date();
console.log(date.toLocaleString());
console.log('今天是星期'+date.getDay());
</script>

 

posted @ 2019-09-25 13:49  菜鸟-传奇  阅读(2489)  评论(0)  编辑  收藏  举报