京东2018校招Web前端工程师笔试有感

最新推荐文章于 2023-08-02 22:46:27 发布

极客范儿

最新推荐文章于 2023-08-02 22:46:27 发布

阅读量3.3k

点赞数 1

分类专栏： HTML5与CSS3实战文章标签： web 前端开发京东

本文链接：https://blog.csdn.net/prototype___/article/details/77899228

版权

HTML5与CSS3实战专栏收录该内容

20 篇文章 0 订阅

订阅专栏

　　在牛客网练习过近两年的题，最后的笔试也在牛客网上。
　　这次笔试根据我的印象，考察了ES6的新规范，JS的基础考察了不少，JQuery涉及了一部分，网络协议有一道，关于HTML5和CSS的新规范也有相当一部分。操作DOM对象的有两三道，canvas有一道。最后的两道编程答题，一道用JS写函数，一道我用java完成的。前端知识考察的比较多，算法考的比前一年少。前端是我想发展的方向，加油！
　　听大佬讲这种类型的考试是可以用两台电脑的。不要以学习为目的，以进去为目的，进去以后再学习也是可以的。不过我是老实人，都是靠自己原有知识储备答的题。
　　JavaScript第一道答题时购物车的问题。自己设计程序，可以实现删除每件商品和商品总价。完成了一个小程序仅供参考。
　　

<!DOCTYPE html>  
<html>  
<head>  
    <title></title>  
    <style type="text/css">  
body,html{  
    padding: 0;  
    margin: 0;  
    font-size: 14px;  
    color: #000000;  
}  
table{  
    border-collapse: collapse;  
    width: 100%;  
    table-layout: fixed;  
}  
thead{  
    background: #3d444c;  
    color: #ffffff;  
}  
td,th{  
    border: 1px solid #e1e1e1;  
    padding: 0;  
    height: 30px;  
    line-height: 30px;  
    text-align: center;  
}  
    </style>  
</head>  
<body>  
<table id="jsTrolley">  
    <thead><tr><th>名称</th><th>价格</th><th>操作</th></tr></thead>  
    <tbody>  
        <tr><td>产品1</td><td>10.00</td><td><a href="javascript:void(0);">删除</a></td></tr>  
        <tr><td>产品2</td><td>30.20</td><td><a href="javascript:void(0);">删除</a></td></tr>  
        <tr><td>产品3</td><td>20.50</td><td><a href="javascript:void(0);">删除</a></td></tr>  
    </tbody>  
    <tfoot><tr><th>总计</th><td colspan="2">60.70(3件商品)</td></tr></tfoot>  
</table>  

<script type="text/javascript">  



function add(items) {  

    sum = 60.70;  
    for(var i =0 ;i<items.length ;i++){  
        var add = document.createElement("tr");  
        var src = document.getElementsByTagName("tbody");  
        add.innerHTML = "<td>"+items[i].name+"</td><td>"+items[i].price+"</td><td><a href='javascript:void(0);'>删除</a></td>";  
        src[0].appendChild(add);  
        sum +=items[i].price;  
    }  
    //var num = 3 +items.length;  
    var tableObj = document.getElementById("jsTrolley");  
    var num = tableObj.rows.length -2;  
    tableObj.rows[4+items.length].cells[1].innerText  =sum.toFixed(2)+"("+num+"件商品)";  

}  

function bind() {  

    var arr = document.getElementsByTagName("a");  
    var src = document.getElementsByTagName("tbody");  
    s = src[0];  
    var len = arr.length;  
    for(var i =0 ;i<len ;i++)  
    {  
        arr[i].setAttribute("onclick","foo(s,this)");  
    }  


}  

function foo(x,y){  
    var tar = y.parentNode.parentNode;  
    x.removeChild(tar);  
    var v = y.parentNode.previousSibling.innerHTML;  
    sum -=v;  
    //console.log(sum);  
    var tableObj = document.getElementById("jsTrolley");  
    var num = tableObj.rows.length -2;  
    //console.log(sum2.toFixed(2)+"---"+num2);  
    tableObj.rows[tableObj.rows.length-1].cells[1].innerText = sum.toFixed(2)+"("+num+"件商品)";  

}     

var items = [{name:'ilv',price:10.0},{name:'ilv2',price:10.0}];  

add(items);  
bind();  


function show(){  
    var tableRowInfo ="";  
    tableObj = document.getElementById("jsTrolley");  
    for(var i =0 ;i<tableObj.rows.length ; i++){  

        for(var j=0 ;j<tableObj.rows[i].cells.length ; j++){  
            tableRowInfo  +=  tableObj.rows[i].cells[j].innerText + " ";  
        }  
        console.log(tableRowInfo); // 打印每行信息  
        tableRowInfo ="";     
    }  
}  
show();  


</script>  


</body>  
</html>

前端部分的代码可以在线调试还是比较人性化的。

极客范儿

关注

1
点赞
踩
5

收藏

觉得还不错? 一键收藏
打赏
0
评论
京东2018校招Web前端工程师笔试有感

在牛客网练习过近两年的题，最后的笔试也在牛客网上。　　这次笔试根据我的印象，考察了ES6的新规范，JS的基础考察了不少，JQuery涉及了一部分，网络协议有一道，关于HTML5和CSS的新规范也有相当一部分。操作DOM对象的有两三道，canvas有一道。最后的两道编程答题，一道用JS写函数，一道我用java完成的。前端知识考察的比较多，算法考的比前一年少。前端是我想发展的方向，加油！　　听
复制链接

扫一扫