面试题 ------ 前端部分

古城微笑少年丶 2022-05-12 13:26 191阅读 0赞

## 1、简单所以下html，css，javascript 在网页开发中的定位？ ##

HTML 超文本标记语言 定义网页的结构
    CSS 层叠样式表，用来美化页面
    JavaScript 主要用来验证表单，做动态交互（其中 ajax）

## 2、简单介绍下ajax？ ##

什么是ajax？
        异步的javascript 和 xml
    作用是什么？
        通过AJAX 与服务器进行数据交换，AJAX 可以使用网页实现布局更新，这意味着可以不重新加载整个页面的情况下，对网页的某个部分进行更新.
    怎么来实现 Ajax？
        XxmlHttpRequest 对象，使用这个对象可以一步向服务器发送请求，获取响应，完成局部更新。Open send responseText/responseXML 局部响应
    使用场景？
        登陆失败时不跳转页面，注册时提示用户名是否存在，二级联动等等使用场景。

## 3、js 和 jQuery 的关系? ##

jQuery 是一个js 框架，封装了js 的属性和方法， 并且增强了js 的功能，让用户使用起来更加便利。
        原来使用 js 是要处理很多兼容性问题，由jQuery 封装了低层，就不用处理兼容性问题。原生的js 的dom 和事件绑定等操作非常麻烦，jQuert 封装以后操作非常方便。

## 4、jQuery 的常用选择器 ##

ID 选择器        通过ID 获取一个元素
    Class 选择器     通过类（css）获取元素
    标签选择器        通过标签获取元素
    通用选择器        获取所有得元素
    
    div.myclass      获取myclass 这个类的div
    
    层次选择器        
        儿子选择器 >      获取下面得子元素
        后代选择器 空格   获取下面得后代 包括儿子、孙子等后代
    属性选择器
        Tag[attrName='test'] 获取有属性名为xxx 并且属性的值为 test 的所有 xxx 标签
        <input type="checkbox" name="hobby" />吃饭<br/>
        <input type="checkbox" name="hobby" />睡觉<br/>
    Input[name="hobby"],表示获取属性名为name 并且 name 属性值为hobby 的所有input 标签元素

## 5、jQuery 的页面加载完毕事件？ ##

很多时候我们需要获取元素，但必须等到该元素被加载完毕完成后才能获取，我们可以把js代码放到该元素的后面，但是这样就会造成js 在我们body中存在不好管理，所有页面加载完毕所有元素当然已经加载完毕，一般获取元素做都要在页面加载完毕后操作。
    第一种：
        $(document).ready(function(){
    
        });
        $(document) 把原生的document 这个dom对象转换为jQuery 对象，转换完成后才能调用ready 方法
    
        ready(fn),表示的是页面结构加载完毕后执行插入函数fn
    
    第二种：
        $(funtion(){
    
        });
        当页面加载完毕后执行里面的函数
    
    
    和window.onload 的区别
    1、jQuery 中的页面加载完毕事件，表示的是页面结构加载完毕
    2、window.onload 表示的是页面被加载完毕
    
        <img src="http://baidu.com/1.jpg" />  onload 必须等页面的图片、声音、图形等远程资源加载完毕后才能调用。而JQuery 中只需要页面结构被加载完毕。

## 6、jQuery 的Ajax 和原生js 实现Ajax 有什么关系？ ##

JQuery 中的Ajax 也是通过原生的js 封装的。封装完成后让我们使用起来更加便利，不用考虑底层实现或兼容性等处理。
        如果采用原生js 实现Ajax 是非常麻烦的，并且每次都是一样的。如果我们不使用JQuery 我们也要封装对象的方法和属性。有像JQuery 这些已经封装完成，并且经过很多企业实际的框架，比较可靠并且开源。我们就不需要封装，直接使用成熟的框架（jQuery）即可。

## 7、简单说一下html5？ ##

html5 是最新版本得 html，是在原来html4 的基础上增强了一些标签。
        html 增加了一些像画板、声音、图像、视频、web 存储等高级功能。但是html5 有一个不好的地方，那就是 html5 太强调语义了，导致开发中都不知道要现在那个标签。
        在做页面布局时，无论头部、主题、导航等模块使用div 来表示，但html5 的规范，需要使用不同标签表示。（header foorer等）

## 8、简单说一下css3？ ##

css3 是最新版本的css ，是对原理 css2 的功能增强。
        css3 中提供了一些原来css2 中实现起来比较困难或者不能实现的功能。    
            1、盒子圆角边框
            2、盒子和文字的阴影
            3、渐变
            4、转换 移动 缩放 旋转等
            5、动画、过度都可以使用动画
            6、可以使用媒体查询实现响应式网站
        css3 最大缺点就是要根据不同的浏览器处理兼容性。对应有一些处理兼容性的工具。不用担心。

## 9、bootstarp 是什么？ ##

Bootstrap 是一个移动设备优先的UI 框架。我们可以不用写任何css，js 代码就能实现比较漂亮的有交互性的页面，我们程序员对页面的编写是有硬伤的，所以要自己写页面的话就要使用类似于Bootstrap 这样的UI框架。
        平时用很多的：
            1、模态框
            2、表单、表单项
            3、布局
            4、删格线