外派蚂蚁金服笔.1A,B,C会占据整合body的宽度所有元素内的文字垂直居中、水平居中。虚线为元素边框示意线，不需要显示字符串隐藏部分内容一位在末尾实现一个 convert 函数,201

....492

于 2023-04-06 23:16:05 发布

阅读量324

点赞数

本文链接：https://blog.csdn.net/weixin_61662162/article/details/129998424

版权

外派蚂蚁金服-笔试

1.A,B,C会占据整合body的宽度。2.A宽度固定200px，C宽度固定150PX，B会占据剩余的所有宽度
3.C永远吸附在页面的最顶部不随页面滚动而滚动，A\B会随页面滚动而滚动

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body{
            margin: 0;
            padding: 0;
            width: 100%;
            display: flex; 
            height: 100vh;
            text-align: center;
            color:#fff;
            position: relative;
            
        }
        .A{
            width: 200px;
            height: 120vh;
            line-height: 60vh;
            background-color: #f8e733;
        }
        .B{
            flex: 1;
            background-color:#4a90e2;
            line-height: 60vh;
            height: 120vh;
        }
        .D{
            height: 80vh;
            width: 150px;
        }
        .C{
           
            height: 80vh;
            width: 150px;
            line-height: 40vh;
            background-color: #50e3c2;
            position:fixed;
            top: 0;
            right: 0;
        }
    </style>
</head>
<body>
    <div class="A">a</div>
    <div class="B">b</div>
    <div class="D">D</div>
    <div class="C">c</div>
</body>
</html>

在这里插入图片描述
所有元素内的文字垂直居中、水平居中。（这一步没有完成）
nav 固定宽度 50px，高度占满，背景色红色 red
header 高度固定 100px, 宽度撑满，背景色蓝色 blue
left 宽度 = right 宽度 = 200px，背景色绿色 green，content 宽度占满，背景色黄色 yellow。left、content、right 高度撑满。
虚线为元素边框示意线，不需要显示
所有元素内的文字垂直居中、水平居中。
nav 固定宽度 50px，高度占满，背景色红色 red
header 高度固定 100px, 宽度撑满，背景色蓝色 blue
left 宽度 = right 宽度 = 200px，背景色绿色 green，content 宽度占满，背景色黄色 yellow。left、content、right 高度撑满。
虚线为元素边框示意线，不需要显示

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        body {
            display: flex;
            padding: 0;
            margin: 0;
            width: 100vw;
            height: 100%;
            display: flex;
            color: #fff;
            text-align: center;
        }
        .nav {
            position:static;
            top: 0;
            left: 0;
            width: 20vw;
            height: 100vh;
            background-color:red;
        }
        .box1{
            flex: 1;
            display: flex;
            height: 100vh;
            flex-direction: column;
        }
        .header{
            width: 100%;
            height: 100px;
            background-color:blue; 
        }
        .box2{
            flex: 1;
            display: flex;
            justify-content: space-between;
            
        }
        .left{
            width: 200px;
            background-color:green; 
        }
        .right{
            width: 200px;
            background-color:green; 

        }
        .content{
            flex: 1;
            background-color:yellow; 
        }
    </style>
</head>
<body>
    <div class="nav">nav</div>
<div class="box1">
    <div class="header">header</div>
   <div class="box2">
    <div class="left">left</div>
    <div class="content">content</div>
    <div class="right">right</div>
   </div>
</div>
</body>
</html>

在这里插入图片描述

字符串隐藏部分内容

说明：实现一个方法，接收一个字符串和一个符号，将字符串中间四位按指定符号隐藏
1. 符号无指定时使用星号（*）
1. 接收的字符串小于或等于四位时，返回同样长度的符号串，等同于全隐藏，如 123，隐藏后是 ***
1. 字符串长度是大于四位的奇数时，如 123456789，隐藏后是 12****789，奇数多出来的一位在末尾

<script>
         let arrList = ['12345','123456789', 'lxlxbaba', 'lx', 'summer', '855520cfoni'];
     
     // 方法一 // 通过遍历 查找到属于范围内的数据进行替换
         function mask(str, rep = '*') {
            // 把传过来的数据转换为数组
             let strArr = str.split('');
            //  leg是数组的长度
             let leg = strArr.length;
            //  处理后的数据
             let result = [];
            //   Math.ceil 向上取整  // 截取起点
             let num = Math.ceil((leg - 4) / 2);

             for (let i = 0; i < leg; i++) {
                // . 字符串长度是大于四位的奇数时，如 123456789，隐藏后是 12****789，奇数多出来的一位在末尾
               if (leg - num - 4 - 1 >= i || i >= leg - num) {
                 result.push(strArr[i]);
               } else {
            //  接收的字符串小于或等于四位时，返回同样长度的符号串，等同于全隐藏，如 123，隐藏后是 ***
                 result.push(rep);
               }
             }

            //  转化为字符串
             return result.join('');
           }
       // 方法二  通过替换固定范围内容
           function mask2(str, rep = '*') {
                let num = Math.ceil((str.length - 4) / 2); // 截取起点
                // 开始的位置
                let start = str.length - 4 - num;
                // 结束的位置
                let end = str.length - num;
                start = start > 0 ? start : 0;
                let strArr = str.split('');
                for (let i = start; i < end; i++) {
                  strArr[i] = rep;
                }
                return strArr.join('');
         }
      // 方法三  截取出不需要隐藏的部分进行拼接
           function mask3(str, rep = '*') {
             let start = Math.floor((str.length - 4) / 2); // 向下取整数做开始索引
             let strss = new Array((str.length >= 4 ? 4 : str.length) + 1).join(rep); // 生成替换长度字符串
             if (str.length <= 4) {
               return strss;
             } else {
               return str.substr(0, start) + strss + str.substr(start + 4, str.length);
             }
           }

     
</script>

实现一个 convert 函数, 接收一个 10 进制整数 n (n >= 0)，转化为 7 进制数（用字符串表示）。例如：7 转化为 ‘10’，2019 转化为 ‘5613’。

<script>
function convert(n,base=7){
    console.log(n);
    // 0 不用转换
    if(n===0){
        return '0'
    }
    let res = '';
     let isPositiveNum = true;
     if (n < 0) {
        n = -n;
         isPositiveNum = false;
     }
     while (n !== 0) {
         let yushu = n % base;
         res += yushu;
         n = Math.floor(n / base);
     }
     res = res.split('').reverse().join('')
     return isPositiveNum ? res : '-' + res;

   

}

console.log(convert(2019));

</script>

....492

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
外派蚂蚁金服笔.1A,B,C会占据整合body的宽度所有元素内的文字垂直居中、水平居中。虚线为元素边框示意线，不需要显示字符串隐藏部分内容一位在末尾实现一个 convert 函数,201

1.A,B,C会占据整合body的宽度。2.A宽度固定200px，C宽度固定150PX，B会占据剩余的所有宽度3.C永远吸附在页面的最顶部不随页面滚动而滚动，A\B会随页面滚动而滚动
复制链接

扫一扫