zoukankan      html  css  js  c++  java
  • Web前端开发面试题

    1. 以下的代码有问题吗?如果有你觉着应该如何修改? for(int i=0; i<list.size(); i++) {  .....  .....  if(...)  {   list.remove(i);  } }
    答案: 每次remove会造成list.size()的值减少(但i可没有减少),这样会造成循环不完的状况,导致漏删。
    解决的方式是反着遍历容器。
    for(int i=(list.size()-1); i>=0; i--), 这样索引i和size同时减少,就不会有遗漏了。   2. 商务系统中,在数据库中,如何合理保证一商品被添加和购买时数量不出现偏差?(不能使用java的多线程同步操作)
    答案: 使用update product set count=100 where id=3 for update; 则这一句sql在执行时,永远处于等待状态,除非事务被提交或回滚  
    3. 判断javascript函数的输出? function f(a, b, c) {  alert('first function'); }
    function f(a, b) {  alert('second function'); }
    f(1, 2, 3);
    答案:输出second function 
    最后被加载的同名函数先被调用,javascript不会根据传入参数的个数不同自动选择匹配的函数。 
    4. 判断javascript函数的输出? <script type="text/javascript"> var f = function(){  alert('variable function'); };
    function f() {  alert('general function'); } f();
    </script>
    答案:输出variable function 
    function方式定义的函数先被加载,最后加载其他js代码,包括变量类型的函数的定义。后加载的先被调用。

    一、写出几种IE6 BUG的解决方法。
    这里能写多少是多少,最好把自己遇到的全写出来。可以借鉴http://css.doyoe.com/ 问题和经验列

    表,里面应有尽有。写几个常见的:
    1.解决IE6及更早浏览器浮动时产生双倍边距的BUG
    display:inline

    2.如何解决IE6下的文本溢出BUG(行业内称:多出一只猪)
    删除2个div之间所有的注释;
    不设置浮动;
    调整2个div的宽度,比如将宽度调整为更小一点,刷新页面看效果。

    3.DIV浮动IE文本产生3象素的bug

    左边对象浮动,右边采用外补丁的左边距来定位,右边对象内的文本会离左边有3px的间距. #box{

    float:left; 800px;} #left{ float:left; 50%;}

    #right{ 50%;} *html #left{ margin-right:-3px; //这句是关键} <div id=”box”>

    <div id=”left”></div> <div id=”right”></div> </div>

    4.css hack

    5.如果这道题出的不是IE6 而是让你列举各浏览器之间的兼容性解决方法,就要写死了。。太多太多

    二、如果让一个div在页面中垂直居中(动动脑子,其实方法很多,各有利弊)

    1.绝对定位法<div style=’position:absolute;top:50%;left:50%;’></div>

    2.单行垂直居中(重点是里面的文字是单行)
    div {
    height:25px;
    line-height:25px;
    overflow:hidden;
    }

    3.多行未知高度文字的垂直居中

    div {
    padding:xxpx; (谁都会吧)
    }

    4.多行文本固定高度的垂直居中 (IE6不能正确地理解display:table和display:table-cell,所以要

    用css hack,想知道为什么这样做,可以参考

    http://www.cnblogs.com/chuncn/archive/2008/10/09/1307321.html,)

    div#wrap父容器 {
    display:table;
    border:1px solid #FF0099;
    background-color:#FFCCFF;
    760px;
    height:400px;
    _position:relative;
    overflow:hidden;
    }
    div#subwrap子容器 {
    vertical-align:middle;
    display:table-cell;
    _position:absolute;
    _top:50%;
    }
    div#content内容 {
    _position:relative;
    _top:-50%;
    }

    三、如何让2个并列的div自动等高(不设高度)
    注:如果能写出3种常见方法固然最好,但最好写一下各自优缺点,否则面试时肯定会问你为什么这样

    1、背景模拟法(假高度),按照尺寸制作背景,平铺,当内容增多时,背景就会向下纵向重复,看起

    来就向左右两个div都自动向下延伸了一样。

    2、表格嵌套法(不难理解,表格都是等高的,就是在div中嵌套表格)

    3、内外补丁法(最推荐的方法,因为只用css实现的,但初学者不易理解)
    * { margin:0; padding:0; }
    #wrap {
    overflow:hidden; (这行代码是重点,否则你会看到页面很长很长)
    padding:0;
    padding-left:180px;(内补丁)
    }
    #left,#right {
    height:auto;
    margin-bottom:-10000px;(外补丁)
    padding-bottom:10000px;(内补丁)
    }
    #left {
    display:inline;
    float:left;
    180px;
    margin-left:-180px;(外补丁)
    background: #0CF;
    }
    #right{
    float:right;
    100%;
    background: #FC6;
    }

    这里说一下内外补丁,其实也没那么难理解,我的理解就是相互抵消。多用用margin负值,你会了解这

    个原理的。

    四、宽度自适应三栏的布局方式
    三种方法:
    1、绝对定位法(最易理解)
    左右两栏采用绝对定位,分别固定于页面的左右两侧,中间的主体栏用左右margin值撑开距离。于是实

    现了三栏自适应布局。

    html,body{margin:0; height:100%;}
    #left,#right{position:absolute; top:0; 200px; height:100%;}
    #left{left:0; background:#a0b3d6;}
    #right{right:0; background:#a0b3d6;}
    #main{margin:0 210px; background:#ffe6b8; height:100%;}

    <div id=”left”></div>
    <div id=”main”></div>
    <div id=”right”></div>

    2、margin负值法(不易理解)

    html,body{margin:0; height:100%;}
    #main{100%; height:100%; float:left;}
    #main #body{margin:0 210px; background:#ffe6b8; height:100%;}
    #left,#right{200px; height:100%; float:left; background:#a0b3d6;}
    #left{margin-left:-100%;}
    #right{margin-left:-200px;}

    <div id=”main”>
    <div id=”body”></div>
    </div>
    <div id=”left”></div>
    <div id=”right”></div>

    重点是第一个div是中间的main,且必须套一个容器。

    3、浮动法(最常见)

    html,body{margin:0; height:100%;}
    #main{height:100%; margin:0 210px; background:#ffe6b8;}
    #left,#right{200px; height:100%; background:#a0b3d6;}
    #left{float:left;}
    #right{float:right;}

    <div id=”left”></div>
    <div id=”right”></div>
    <div id=”main”></div>

    重点是中间的main要放在标签最后,缺点是需要用clear:both

    五、一小张效果图,大致内容是一个图片列表,ul内边距左:10px 右:10px。ul中的li右边距30px,

    但最后一个li距离ul只有10px,也就是ul有边框,里面的li图片列表也有边框。(这些属性是定死的,

    你不能修改,要求写出这段css代码)

    这道题,其实也是考你的内外补丁掌握,大致方法是,ul设置左右内边距后,设置li的margin负值,这

    样li在ul的框里就居中了。还有一种比较傻瓜的办法,设置li的margin-right:30px的后,最后一个li

    需要改class,把margin-right清掉。

    六、谈谈你对WEB标准以及W3C的理解与认识。
    这题网上随便找找都有,大致要点:标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用

    外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内

    容能被更广泛的设备所访问、更少的代码和组件,容易维护、改版方便,不需要变动页面内容、提供打

    印版本而不需要复制内容、提高网站易用性。

     
     
     
  • 相关阅读:
    ASP.NET web.config中数据库连接字符串connectionStrings节的配置方法
    Identity(三)
    数字证书的使用
    自建mvc5项目里几个类图
    asp.net MVC 常见安全问题及解决方案
    security相关链接整理
    js面向对象编程:if中可以使用哪些作为判断条件呢?
    c#创建Windows service (Windows 服务)基础教程
    angular1框架前台笔记
    angular1.几框架新接口添加
  • 原文地址:https://www.cnblogs.com/coolid/p/3152202.html
Copyright © 2011-2022 走看看