zoukankan      html  css  js  c++  java
  • web前端校招笔试题集锦

    写一个求和的函数sum,达到下面的效果
    // Should equal 15
    sum(1, 2, 3, 4, 5);
    // Should equal 0
    sum(5, null, -5);
    // Should equal 10
    sum('1.0', false, 1, true, 1, 'A', 1, 'B', 1, 'C', 1, 'D', 1,
      'E', 1, 'F', 1, 'G', 1);
    // Should equal 0.3, not 0.30000000000000004
    sum(0.1, 0.2);
    function sum() {
        var nResult = 0;
        for (var i = 0, l = arguments.length; i < l; i++) {
            nResult += window.parseFloat(arguments[i]) || 0;
        }
        return nResult.toFixed(3) * 1000 / 1000;
    }

     

    请写一个表格以及对应的CSS,使表格奇数行为白色背景,偶数行为灰色背景,鼠标移上去时为黄色背景。

    <table class="table">
      <tr><td>第一行</td></tr>
      <tr><td>第二行</td></tr>
      <tr><td>第三行</td></tr>
      <tr><td>第四行</td></tr>
    </table>
     
    <style>
      .table tr:nth-child(2n-1){
          background-color:white;
      }
      .table tr:nth-child(2n){
          background-color:grey;
      }
      .table tr:hover{
          background-color:yellow;
      }
    </style>

    写一个traverse函数,输出所有页面宽度和高度大于50像素的节点。

    function traverse(oNode) {
        var aResult = [];
        oNode = oNode || document.body;
        if (oNode.style) {
            var nWidth = window.parseInt(oNode.style.width, 10) || 0;
            var nHeight = window.parseInt(oNode.style.height, 10) || 0;
            if (nWidth > 50 && nHeight > 50) {
                aResult.push(oNode);
            }
        }
        var aChildNodes = oNode.childNodes;
        if (aChildNodes.length > 0) {
            for (var i = 0, l = aChildNodes.length; i < l; i++) {
                var oTmp = aChildNodes[i];
                aResult = aResult.concat(traverse(oTmp));
            }
        }
        return aResult;
    }

    左图右文如何实现

    <div class="item">
      <div class="pic">...</div>
      <div class="content">...</div>
    </div>
    css实现:
    
    .item .pic { float:left;margin-right:10px; }
    .item .content { overflow:hidden;zoom:1; } /* 或用display:table-cell */

    输入一个文件名,输出它相应的后缀 如输入 abc.txt 输出 txt

     1  <script type="application/javascript">
     2    function getText(){
     3    //获取input的值
     4    var testName = document.getElementsByTagName("input")[0].value;
     5    //<p>节点
     6    var pNode = document.getElementsByTagName("p")[0];
     7   
     8    var newArray = new Array();
     9     
    10    //拆分之后的字符串存入到arryStr中
    11    var arryStr = testName.split("");
    12    //循环判断
    13    for(var i=0;i<arryStr.length;i++){
    14        //当判断第i个字符串不等于"."的时候,就将数组中最后一个字符pop()出来,push()到newArray数组中
    15        if(arryStr[i]!="."){
    16            newArray.push(arryStr.pop());
    17        }
    18    }
    19    //将newArray中的每个字符都连接连接成一个字符串,并且反转,复制给p节点的文本
    20    pNode.textContent = newArray.reverse().join(""); 
    21 }
    22     </script>
    23 
    24     <body>
    25     文件名:<input type="text" value=""/><br>
    26     文件格式:<p> </p><br>
    27     <button id="btn" onclick="getText()">点击</button>
    28 </body>

    输出效果:

    image

    一开始没有考虑到反转的问题,由于pop()是从后往前删除的,所以如果不进行反转,输出的文件格式是倒置过来的。而且我一开始就是用abc.txt来测试,输出结果尽管是错的但是也都是”txt“。

    这道题目考察了比较多js对象的方法:

    例如String对象的split()方法,是用于将字符串分割成字符串数组的;

    Array对象的pop()方法,是用于删除并返回数组的最后一个元素的;

    Array对象的push()方法,是向数组的末尾添加一个或多个元素,并返回新的长度的;

    Array对象的join()方法,是把数组的所有元素放入一个字符串,然后元素通过指定的分隔符进行分隔;

    Array对象的reverse()方法,用于颠倒数组中元素的顺序。

    同时还考察了一些js操作dom的最基本的语法,例如getElementsByTagName什么的。

    请给Array本地对象增加一个原型方法,它用于删除数组条目中重复的条目(可能有多个),返回值是一个包含被删除的重复条目的新数组。

    Array.prototype.distinct = function() {
        var ret = [];
        for (var i = 0; i < this.length; i++)
        {
            for (var j = i+1; j < this.length;) {   
                if (this[i] === this[j]) {
                    ret.push(this.splice(j, 1)[0]);
                } else {
                    j++;
                }
            }
         }
         return ret;
    }
    //for test
    alert(['a','b','c','d','b','a','e'].distinct());

    JS异步加载

    function loadScript(url,callback){
        var script=document.creatElement("script");
        script.type="text/javascript";
        if(script.readyState){
            script.onreadystatechange=function(){                  
    if(script.readyState=="loaded" || script.readyState=="complete"){ script.onreadystatechange=null; callback(); } } }else{ script.onload=function(){ callback(); } } script.src=url; document.getElementsByName("head")[0].appendChild(script); }
  • 相关阅读:
    考研打卡_Day018
    如何使用python中的pymysql操作mysql数据库
    Linux系统目录结构和常用目录主要存放内容的说明
    MySQL基础入门使用和命令的使用
    Python中property属性的概论和使用方法
    如何有效的优化自己的网站访问速度
    机器学习中的特征工程学习
    ffmpeg中c语言sdk多媒体互转主要使用的api
    FFmpeg使用c语言sdk实现打印视频的信息
    ffmpeg使用C语言sdk实现抽取视频中的视频数据
  • 原文地址:https://www.cnblogs.com/simonryan/p/4846380.html
Copyright © 2011-2022 走看看