JS基础闯关大作战

最新推荐文章于 2022-01-20 10:21:45 发布
最新推荐文章于 2022-01-20 10:21:45 发布
阅读量1.5k 收藏 1
点赞数 2
分类专栏： 前端合集 文章标签： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u010834071/article/details/39271991
版权
第一关：
<script  type  = "text/javascript" >

      // 声明一个函数，求两个数的和，测试你声明的函数
      function  sum(a ,b){
          return  a+b ;
    }
    document.write (sum( 2 , 3  ));

</script>


第二关：
<script  type  = "text/javascript" >

      // 声明一个函数，求任意个数的和，测试你声明的函数
    document.write (sum( 2 , 3  , 7 )+ "<br />"  );
    document.write (sum( 2 , 3  , 7 , 4 , 3  , 1 )+ "<br />"  );
    document.write (sum( "Hello"  , " " , "Tom"  )+ "<br />" );
    
      function  sum () {
          var  result =  0 ;
          // 函数实际调用执行时传入的参数，可以从  arguments 伪数组中获取
          for ( var  i =  0  ; i < arguments.length ; i++) {
            result += arguments [i];
         }
          return  result;
    }

</script>


第三关：

<script  type  = "text/javascript" >

      // 已有函数如下
      function  fun01(){
          return  [ 23 , true  , " 恭喜通过第  03 关 !"  ];
    }
    
      // 如何得到 " 恭喜通过第  03 关 !"  ？
    document.write (fun01()[ 2 ]);

</script>

第四关：
<script  type  = "text/javascript" >

      // 已有函数如下
      function  fun01(){
          return  {
            stuName :  "Tom" ,
            stuAge :  12 ,
            stuWords :  " 恭喜通过第  04 关 !"
         };
    }
    
      // 如何得到 " 恭喜通过第  04 关 !"  ？
    document.write (fun01().stuWords);

</script>



第五关：

<script  type  = "text/javascript" >

      // 已有函数如下
      function  fun01(){
          return  function  (){
              return  "  恭喜通过第  05 关 !"  ;
         };
    }
    
      // 如何得到 " 恭喜通过第  05 关 !"  ？
    document.write (fun01()());

</script>


第六关：

<script  type  = "text/javascript" >

      // 已有函数如下
      function  fun01(){
          return  {
            sayHello :  function  (){
                  return  "  恭喜通过第  06 关 !"  ;
             }
         };
    }
    
      // 如何得到 " 恭喜通过第  06 关 !"  ？
    document.write (fun01().sayHello());

</script>

第七关：
   <script  type  = "text/javascript" >

      // 已有函数如下
      function  fun01(){
          return  "abc"  ;
    }
    
    fun01.subFun =  function (){
          return  "  恭喜通过第  07 关 !"  ;
    }
    
      // 如何得到 " 恭喜通过第  07 关 !"  ？
    document.write (fun01.subFun ());

</script>    


第八关：
<script  type  = "text/javascript" >

      // 已有函数如下
      function  fun01(){
          return  "abc"  ;
    }
    
    fun01.subObj = {
        subFun :  function  (){
              return  "  恭喜通过第  08 关 !"  ;
         }
    };
    
      // 如何得到 " 恭喜通过第  08 关 !"  ？
    document.write (fun01.subObj.subFun ());

</script>

第九关：
<script  type  = "text/javascript" >

      // 已有函数如下
    ( function  (w ){
        w.jQuery =  function (){
              return  "  恭喜通过第  09 关 !"  ;
         };
    })(window);
    
      // 如何得到 " 恭喜通过第  09 关 !"  ？
    document.write (window.jQuery ());

</script>

第十关：
<script  type  = "text/javascript" >

      // 已有函数如下
    ( function  (w ){
        w.$ =  function (){
              return  {
                text :  function (){
                      return  "  恭喜通过第  10 关 !"  ;
                 }
             };
         }
    })(window);
    
      // 如何得到 " 恭喜通过第  10 关 !"  ？
    document.write ($().text());

</script>





第十一关；
<script  type  = "text/javascript" >

      // 已有函数如下
    ( function  (w ){
        w.$ =  function (){
              return  function (){
                  return  "  恭喜通过第  11 关 !"  ;
             };
         }
    })(window);
    
      // 如何得到 " 恭喜通过第  11 关 !"  ？
    document.write (window.$()());

</script>

第十二关：【boss来了···】
<script  type  = "text/javascript" >

      // 已有函数如下
    ( function  (w ){
        w.$ =  function (f){
              return  f();
         }
    })(window);
    
      function  sayHello(){
          return  "  恭喜通过第  12 关 !"  ;
    }
    
      // 如何得到 " 恭喜通过第  12 关 !"  ？不允许直接调用  sayHello
    document.write (window.$(sayHello));

</script>


第十三关：
<script  type  = "text/javascript" >
      // 已有函数如下
    ( function  (w ){
        w.$ =  function (id){
              return  core(document.getElementById (id));
         }
        
          function  core(dom ){
              var  obj = {
                    element : dom,
                    text :  function  () {
                          return  this.element.firstChild.nodeValue;
                     }
                 };
            obj.text ();
              return  obj;
         }
        
    })(window);

    window.onload =  function (){
        
          // 如何得到 " 恭喜通过第  13 关 !"  ？
        alert ($( "btn"  ).text ());
    }

</script>
</head>
<body>

     <button  id = "btn" >  恭喜通过第 13 关  ! </button>

</body>
</html>


第十四关：【大boss】

<script  type  = "text/javascript" >
      // 已有函数如下
    ( function  (w){
        w.$ =  function (argument){
              if (argument  instanceof  Function){
                window.onload = argument ;
             } else  if (argument  instanceof  String ||  typeof  argument ==  "string" ){
                  var  ele = document.getElementById(argument );
                  return  $(ele );
             } else  if (argument  instanceof  Element){
                  return  {
                    ele : argument ,
                    text :  function (){
                          return  this.ele.firstChild.nodeValue;
                     }
                 };
             }
         }
    })(window);
    
      // 如何在页面加载完成时得到“恭喜通过第  14 关 !  ”？
    $( function  (){
        alert ($( "btn"  ).text ());
    });
    
      /* window.onload = function(){
        alert("ttt");
    }; */

</script>
</head>
<body>

     <button  id = "btn" >  恭喜通过第 14 关  ! </button>

</body>






第十四关：【终极boss】

<script  type  = "text/javascript" >
      // 已有函数如下
    ( function  (w){
        w.$ =  function (argument){
              if (argument  instanceof  Function){
                window.onload = argument ;
             } else  if (argument  instanceof  String ||  typeof  argument ==  "string" ){
                  var  ele = document.getElementById(argument );
                  return  $(ele );
             } else  if (argument  instanceof  Element){
                  return  {
                    ele : argument ,
                    text :  function (){
                          return  this.ele.firstChild.nodeValue;
                     },
                    click :  function (callBack){
                        this.ele.onclick = callBack ;
                     }
                 };
             }
         }
    })(window);
    
      // 如何在点击按钮后弹出“恭喜通过第  15 关 !  ”？
    $( function  (){
        $ ( "btn"  ).click ( function (){
            alert ($( this  ).text ());
              //this.firstChild.nodeValue;
         });
          /* ele.onclick = function(){
            
        }; */
    });

</script>


------恭喜你顺利通关！----


谭正强
关注
专栏目录
JS 入门篇·编程挑战代码
skysys的研究小屋
02-09 331
编程挑战 小伙伴们，请编写"改变颜色"、"改变宽高"、"隐藏内容"、"显示内容"、"取消设置"的函数，点击相应按钮执行相应操作。 点击"取消设置"按钮后，提示是否取消设置，如是执行操作，否则不做操作。 任务 一、定义"改变颜色"的函数 提示: obj.style.color obj.style.backgroundColor 二、定义"改变宽高&quot
javascript测试题和参考答案----试题源自牛客网
学习中~~~~
04-12 9986
附上牛客网链接： https://www.nowcoder.com/ta/js-assessment?page=1 最近有点不知所措，该用什么，该学什么；随意学起了javascript，就试着做了一下牛客网的试题，附上答案 1、查找数组元素位置 题目描述 找出元素 item 在给定数组 arr 中的位置 输出描述: 如果数组中存在 item，则返回元素在数组中的位置，否则返回 -...
大挑战，JS前端知识闯关，你过得了几关？
BYGFJ的博客
01-20 1008
前言 基础知识真有趣，10个基础知识的题目，请君来战！ 1. a.x = a = {n:2} var a = {n:1}; a.x = a = {n:2}; // 求a.x alert(a.x); 解析 JavaScript 总是严格按照从左至右的顺序来计算表达式。 a.x 最后执行赋值的时候，保留的是对 原来a的引用, alert的时候，a是被重新赋值过后的a。 var a = {n:1}, ref = a; a.x = a = {n:2}; console.log("a:"
《JavaScript 闯关记》
劼哥舍
07-24 1246
为何写作此课程stone 主要负责基于 Web 的企业内部管理系统的开发，虽然能够熟练地使用 JavaScript，但随着对 JavaScript 的理解越来越深，才发现自己尚未掌握其精髓。2015年，公司请来 大胡子姜志辉 为我们培训 JS Dota 课程，让我对 JavaScript 有了全新的认识，他一步步引导我们手写 jQuery、Backbone 等 JavaScript 主流框架，更是
《JavaScript 闯关记》之简介
劼哥舍
07-24 2098
JavaScript 是面向 Web 的编程语言，绝大多数现代网站都使用了 JavaScript，并且所有的现代 Web 浏览器（电脑，手机，平板）均包含了 JavaScript 解释器。 这使得 JavaScript 能够称得上史上使用最广泛的编程语言。 JavaScript 也是前端开发工程师必须掌握的三种技能之一：描述网页内容的 HTML、描述网页样式的 CSS、以及描述网页行为的 JavaS
大挑战！ JS前端知识闯关，你过得了几关？
程序员成长指北
11-01 240
大厂技术高级前端Node进阶点击上方程序员成长指北，关注公众号回复1，加入高级Node交流群前言基础知识真有趣，10个基础知识的题目，请君来战！1. a.x = a = {n:2...
javascript闯关记
java_goodstudy的博客
12-04 775
http://www.jianshu.com/p/83bd92538634
【FCC】javascript算法题闯关汇总（笔记）
julia_xueli的博客
12-30 513
算法题汇总： Sum All Numbers in a Range 题目要求： sumAll([4,1]) should return 10 because sum of all the numbers between 1 and 4 (both inclusive) is 10. 思路：将传入的数组中的元素提取出来，用高斯求和公式计算和 sum=((a1+an)∗n)/2 sum=((a1+an)*n)/2 sum=((a1+an)∗n)/2 解法： function sumAll(arr)
第4部分 循环结构程序设计1
Lixunzhe0112的博客
07-27 1万+
第1关：小球自由落体运动 任务描述 一球从M米高度自由下落，每次落地后返回原高度的一半，再落下。 它在第N次落地时反弹多高？共经过多少米？ 结果保留两位小数。 相关知识（略） 编程要求 根据提示，在右侧编辑器Begin-End处补充代码，并按照要求完成本关任务。 输入 从键盘输入M和N的值。 输出 它在第N次落地时反弹多高？共经过多少米？ 保留两位小数，空格隔开，放在一行。 测试说明 平台会对你编写的代码进行测试，若是与预期输出相同，则算通关。 样例输入： 1000 5 样例输出： 31.25 2875.0
爬虫工程师必玩的三个闯关网站
咸鱼学Python的博客
08-12 1149
通过之前整理的 JS 逆向练手 系列的文章，咸鱼在后台也收到一些反馈：JS 逆向练手项目对萌新选手不是很友好，有没简单的网站可以 py 一下？为了让萌新选手有题可练，咸鱼搜罗了三个可以...
原生js实现贪吃蛇大作战案例
Potry Code的博客
09-02 929
贪吃蛇大作战面向对象的编程思想： 地图: 宽，高，背景颜色，因为小蛇和食物都是相对于地图显示的,这里小蛇和食物都是地图的子元素,随机位置显示,脱离文档流的,地图也需要脱离文档流–css需要设置:宽,高,背景颜色,脱标。 食物—div元素 elements—>存储div的数组(将来删除的食物div时候,先从map中删除div,再从数组中移除div) 食物:宽,高,背景颜色,横坐标,纵坐标 一个...
前端学习网站：闯关学习
qq_41307247的博客
03-06 855
推荐一个前端学习网站，闯关学习： https://learn.freecodecamp.one/responsive-web-design/basic-html-and-html5/headline-with-the-h2-element
使用Dropzone上传图片及回显示例
热门推荐
欲望以提升热忱 毅力以磨平高山
07-24 2万+
一、图片上传所涉及到的问题 1、HTML页面中引入这么一段代码 <div class="row"> <div class="col-md-12"> <form dropzone2 class="dropzone" enctype="multipart/form-data" method="post"></form> </div> </
在项目中使用AngularJS+UI-Grid
欲望以提升热忱 毅力以磨平高山
11-24 1万+
一、效果图     二、简单的需求 使用UI-Grid来显示表格使用infiniteScroll来进行滚动加载，参考文档 三、前端JS /* * Copyright (c) 2013-2015 by The SeedStack authors. All rights reserved. * * This file is part of SeedStack, An
AngularJS中使用$resource（已更新）
欲望以提升热忱 毅力以磨平高山
06-04 9057
这个服务可以创建一个资源对象，我们可以用它非常方便地同支持RESTful的服务端数据源进行交互，当同支持RESTful的数据模型一起工作时，它就派上用场了。      REST是Representational State Transfer（表征状态转移）的缩写，是服务器用来智能化地提供数据服务的一种方式          1）我们首先需要引入ng-Resource  模块，在angul
Angular-UI自动完成输入框AutoComplete[项目中使用]
欲望以提升热忱 毅力以磨平高山
09-01 7558
一、效果展示二、代码参考【view视图】<input id="countryCode" class="control-input" autocomplete="off" name="countryCode" type="text" data-ng-model="anomalieSearchPayId" placeholder="Saisir au moins 2 caractères" ty
Mockito的简单用法示例
欲望以提升热忱 毅力以磨平高山
08-14 6904
Mockito是一个流行的Mocking框架。它使用起来简单，学习成本很低，而且具有非常简洁的API，测试代码的可读性很高。因此它十分受欢迎，用 户群越来越多，很多的开源的软件也选择了Mockito。要想了解更多有关Mockito的信息，请访问它的官方网 站：http://mockito.org/ 一、简单示例/* * Creation : 2015年8月14日 */ package com.
XSS闯关攻略：从基础到进阶
"XSS闯关练习的详细笔记，包含了不同级别的XSS攻击payload实例和解决策略。" 在Web安全领域，XSS（Cross-Site Scripting）是一种常见且危险的攻击方式，允许攻击者在受害者的浏览器上执行恶意脚本。这个记录详细...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值