zoukankan      html  css  js  c++  java
  • web前端面试集锦(自己搜集的,如有错误请不吝赐教)

    css

    1 浏览器兼容性 CSS hack(针对IE6-,IE7,IE8,IE9以及其他浏览器)

    ‘ * ’ : 所有的IE浏览器都能识别

    说明:在标准模式中

    “-″减号是IE6专有的hack

    “9″ IE6/IE7/IE8/IE9/IE10都生效

    “″ IE8/IE9/IE10都生效,是IE8/9/10的hack

    “9″ 只对IE9/IE10生效,是IE9/10的hack

    (还可以这样解决)

    <!-- 放置所有浏览器的样式 -->

    <link rel="stylesheet" href="/css/style.css" type="text/css">

    <!-- 只放置IE必须的,而不能通过W3C的代码 -->

    <!-- [if ie] -->

    <link rel="stylesheet" href="/css/style.css" type="text/css">

    <!-- [endif] -->

    2 .  css position有几个值,作用,默认元素的position是什么?

    css position 有5个值,absolute(相对于static定位以外的第一个父元素进行定位) fixed (相对于浏览器窗口定位)relative(相对于其正常位置定位) static(默认值,没有定位) inherit(规定应该从父元素继承Position属性的值)

    3. 行内元素有哪些?块级元素有哪些?CSS的盒模型?
    块级元素:div p h1 h2 h3 h4 form ul
    行内元素: a b br i span input select
    Css盒模型:内容,border ,margin,padding

     

    4.Css清除浮动方法

    方法一:添加新的元素、应用 clearboth

     

    .clear{clear:both; height: 0; line-height: 0; font-size: 0}

    方法二:父级div定义 overflow: auto

    .over-flow{

        overflow: auto; zoom: 1; //zoom: 1; 是在处理兼容性问题

    }

      方法三  :after 方法:(注意:作用于浮动元素的父亲)

    .outer {zoom:1;}    /* for IE6/7 */

    .outer :after {clear:both;content:'.';display:block; 0;height: 0;visibility:hidden;}   /*for FF/chrome/opera/IE8*/

    5.简单列出所知道的css3以及html5的一些常用属性或者标签

     

    Css3

    border-radius 边框圆角                          box-shadow 边框阴影 

    background-size 背景图片大小                    text-shadow  文本阴影

    word-wrap: normal | break-word  允许长单词换到下一行

    word-break:normal | break-all | keep-all  规定自动换行的规则

    text-overflow:clip | ellipsis | string

    translate(50px,100px) , transform:rotate(30deg) , transform:scale(2,4);

    transform:skew(30deg,30deg),  transform:rotate(30deg).

    过渡 transition  

    Html5

    <canvas> <video> <audio> <footer> <header><hgroup><nav><time><article>

     

    属性: data-aaa   dir (规定元素中内容的文本方向) draggable(规定是否允许用户拖动元素)  accesskey(规定访问元素的键盘快捷键)

    Contenteditable (规定是否允许用户编辑内容)

    6. 解释css sprites,如何使用。
    Css 精灵 把一堆小的图片整合到一张大的图片上,减轻服务器对图片的请求数量

    7. CSS选择符有哪些?哪些属性可以继承?优先级算法如何计算?内联和important哪个优先级高?
    标签选择符 类选择符 id选择符
    继承不如指定 Id>class>标签选择
    后者优先级高

    8. 你如何对网站的文件和资源进行优化?
    文件合并
    文件最小化/文件压缩
    使用CDN托管
    缓存的使用

    9.Css布局:三列,中间宽度自适应,左右边宽度固定100px;

    .box {100%;height:200px;position:relative;}

    .left{position:absolute;left:0px;top:0px;100px;height:100%;}

    .right{position:absolute;right:0px;top:0px;100px;height:100%;}

    .center {margin-left:100px;margin-right:100px;height:100%;}

    <div class="box">

    <div class="left"></div>

    <div class="right"></div>

    <div class="center"></div>

    </div>

    JS

    1. JS有几种数据类型 分别是什么?

    字符串(string),数字(number),数组(array),布尔(boolean)

    对象(object),Null , undefined

     

    2.Jquery获取元素的宽

    $.width()  获取内容区域的宽度(不包括padding margin border的宽度)

    $.innerWidth() 获取到包括内边距的宽度(content+padding)

    $.outerWidth() 获取到内边距+边框的宽度  (content+padding+border)

    $.outerWidth(true)     content+padding+border+margin)

     

    3.  面象对象有几种模式,分别是什么?

    单例模式 (就是一种最简单的面象对象, 一次只有一个实例)

    工厂模式

    构造函数

    原型模式

    4. Ajax有几个状态值,每个状态值代表什么意思?

    0 - (未初始化)还没有调用send()方法
    1 - (载入)已调用send()方法,正在发送请求
    2 - (载入完成)send()方法执行完成,
    3 - (交互)正在解析响应内容
    4 - (完成)响应内容解析完成,可以在客户端调用了

    5. 简述JS的作用域以及作用域链

    作用域:包含全局作用域和局部作用域

    全局作用域使用范围①最外层函数和最外层函数外定义的变量有全局作用域

    ②所有未定义直接赋值的变量自动申明未拥有全局作用域

    ③所有window对象的属性拥有全局作用域

    局部作用域:一般只在固定的代码片段内可以访问,比如:函数内部

    6. this关键字

    var name1 = "windowName";

    function outer(){

    var name1 = "我是上一级作用域";

    function inner(){

    //var name1 = "我是根本"

    alert(this.name1); //这个是属性 输出是ABC 这里this指向的是window;

    alert(name1); //这个是变量 输出的是cba这里考的是作用域,

    }

    inner();

    }

    • outer();

    输出的顺序为: windowName     我是上一级作用域

    7. 数组  split() join() 的区别  数组方法pop() push() unshift() shift()

    var str2  = "012345678";

    var str222 = str2.split("");

    alert(str2.substring(2,8))    

    alert(str222)

    split()  前者是切割成数组的形式,join()后者是将数组转换成字符串
    Push()尾部添加 pop()尾部删除
    Unshift()头部添加 shift()头部删除

    输出:234567    0,1,2,3,4,5,6,7,8

    8.  简述闭包是什么?有什么特性?对页面有什么影响?解决方法?

         闭包是什么:闭包就是能够读取其他函数内部变量的函数

         有什么特性:可以读取函数内部的变量,让变量的值始终保持在内存中

         影响:使函数中的变量都保存在内存中,内存消耗大,网页性能问题,IE中导致内存泄露

         解决方法: 退出函数之前,将不是用的局部变量全部释放

    9.   利用原型以及原型链的原理,写2个函数 分别为加法和减法 ,实现 5+3-2 

    Number.prototype.plus = function(n){ 

    return this+n;

    }

    Number.prototype.reduce = function(n){ 

    return this - n

    }

    (5).plus(3).reduce(2)

    10. 添加 删除 替换 插入到某个接点的方法
    obj.appendChidl()
    obj.innersetBefore
    obj.replaceChild
    obj.removeChild

  • 相关阅读:
    Builder与Factory,殊途同归!
    IIS中的身份验证
    如何给项目选择合适语言(转)
    动态行转列
    ORACLE系统表大全(转)
    C# 操作Word文档(转)
    产品化思维之分层的思想
    开发管理目前开发工作的问题分析和诊断
    MongoDB数据插入、删除、更新、批量更新某个字段
    学习正则表达式
  • 原文地址:https://www.cnblogs.com/maxiaodan/p/5228382.html
Copyright © 2011-2022 走看看