爱奇艺一面（2018.12.24）（20分钟）

  1. 讲一讲你做的动漫素材收集系统

    我负责的前端的UI与实现。因为是组长，所以比较清楚整个系统的组成，分三个部分爬虫后端和前端，爬虫负责从网上爬取关于动漫的图片，然后后端整理数据提供接口，前端利用接口展示数据。整个前端分为搜索图片，展示图片和处理图片三个部分。主要的难点部分在于对于素材的处理部分，这里有点类似在线ps，实现了对图片进行画笔操作以及滤镜操作，这里我用的是canvas。因为有画笔和橡皮擦所以为了避免擦掉图片，我就用的双图层，这一块做的比较多。

  2. 你说一下你们展示图片时候整个系统的流程

    用户首先看到的是前端实现的搜索界面，在这里面输入关键词，前端获取关键词，发送ajax请求到后端，然后后端从数据库中返给前端图片，因为爬虫爬取到的图片存取在本地，所以图片数量受限，然后后端对本地的图片进行处理给前端，这样就给用户展示出来了。这个时候跳转到展示界面，上方依旧有一个搜索框，下方是所有的图片展示，点击任意一个图片可以进入图片的操作界面。

  3. 讲一讲你的信息管理平台

    这个是工作室项目，所有样式比较简单。前端我一个人就做完了，做这个系统是因为，工作室的招新网站上有人报名，这些报名者的信息存在数据库不好操作，因此我做了这样一个系统，方便管理报名者的信息。这个系统分为两个功能，就是注册登录以及信息展示。在信息展示部分是以表格的形式展示报名者的姓名学院等信息。然后对这个表格的信息再有增加删除修改和查询的操作。

  4. 用jquery给元素绑定事件

    比如用点击事件为例：

    1
    2
    3
    $("#bala").click(function () {
    	...
    })

如要查看详细解答，请看博客用jquery给元素绑定事件

  1. 用jquery获取一个dom元素中的值

    如果是一个div的话直接用它的id或class选中之后，有innerHTML和innerText属性可以获得。如果是多个div的话涉及冒泡事件，只需要给父节点绑定事件，然后如下代码所示：

    1
    2
    3
    $("#bala").click(function (event) {
    	var value = event.target.innerHTML;
    })

  2. jquery的选择器

    基于id和类的选择，之后追问还有吗，回答不知道

  3. 怎么用jquery获取其父节点子节点以及兄弟节点

    有如下api:parent(),children(),获取所有兄弟节点用siblings()，下一个兄弟节点next()，之后所有的兄弟节点nextAll()，上一个兄弟节点prev()，之前所有兄弟节点prevAll()，全部父节点parents()

  4. 用jquery实现ajax请求的同步

    jquery不知道，但是我写过原生的ajax,就是用XMLHttpRequest时候，我记得有属性可以改变同步还是异步，代码如下

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    function loadXMLDoc(){
    	var xmlhttp;
    	if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
    		xmlhttp=new XMLHttpRequest();
    	}else{// code for IE6, IE5
    		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    	}
    	xmlhttp.onreadystatechange=function(){
    	  	if (xmlhttp.readyState==4 && xmlhttp.status==200){
    	    	document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
    	    }
    	}
    	xmlhttp.open("GET","/ajax/demo_get.asp",true); //最后一个参数同步true，异步false
    	xmlhttp.send();
    }

经查证之后发现$.ajax()方法有async属性可以设置同步或异步,参数要求为Boolean类型，默认设置为true，所有请求均为异步请求。如果需要发送同步请求，请将此选项设置为false。注意，同步请求将锁住浏览器，用户其他操作必须等待请求完成才可以执行。

  1. css选择器
    基于id和类的选择器，追问如果要选择所有的a标签的话，怎么做，答可以根据标签选择，也可以基于继承关系选择所有子元素，已经下一级子元素。其实标准的答案应该涉及下图内容

  1. disable和readonly的区别

    没有听清被跳过了。其实这两个都是用于表单的属性，disabled的范围更大，不仅可以阻止修改input表单中的值，连button submit都不能够点击，而且设置了disabled后，这个输入域的值也不能够通过form表单传递。readonly的范围较小，仅仅能够阻止修改部分表单的值，select，color range radio checkbox file等无效，可以提交表单，值也照样传递。disabled适合用于，防止客户在网络环境较差时，重复提交表单，当用户点完提交，我们就用js设置submit按钮为disabled

  2. HTTP的几种状态码

    之前配nginx服务时候，遇到过403的问题，最后找到是权限问题，后来查找到4xx是前端问题，5xx是后端问题，200就是成功，3xx是重定位问题

  3. get和post的区别

    做信息管理系统的时候，获取数据用的get接口，修改数据用的post接口

  4. 你还用过其他接口类型吗

    删除数据时候用delete

  5. null和undefined的区别

    null是一个空指针，undefined是未定义，typeof null == "Object"// true

  6. 数组和链表的区别

    数组是顺序结构，链表是链式结构，用指针连接起来，链表有单向链表和双向链表，双向链表有从头指向尾的指针也有从尾指向头的指针。数组方面索引，但是不方便插入与增加删除，链表方便方便增删和插入但是不方便索引，因为数组的存储空间是顺序存储的好找一些，但是链表的存储空间是离散的所有不方便查找

  7. 队列和栈的区别

    队列有有两个口可以进行操作，从一个口进从另外一个口出，所以可以实现先进先出，但是栈只有一个口，实现的是先进后出，队列和栈都可以用数组实现，再加入pop和push方法

  8. 用css实现两个div处在同一行

    绝对定位，float，inline-block，flex

  9. 前端UI库用过没有，具体怎么用的

    用过bootstrap。用的时要引入文件，然后其中有写好的html模板和少量的js。它几乎可以实现很多样式比如头部导航栏，输入框，表格，模态框，我用的话就是把写好的粘进去。

  10. 关于bootstrap的布局你怎么写的

    我看到bootstrap的布局是栅格布局，但是我自己没有改过它本来的布局，如果我自己写布局的话我用flex

  11. 对Vue的学习

    看文档，学习github上的demo

  12. 了解的js弹框

    只知道alert弹框
    http://www.cnblogs.com/asd-sun/p/6560195.html

  13. 你怎么调用jquery的ajax的

    首先规定URL，然后是接口类型，在sucess回调函数中写调用成功之后执行的事情，在error回调函数中写失败之后执行的事情。有两种方式和，如代码所示

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    //方法一，用post(),get()方法
    $.post("/example/jquery/demo_test_post.asp",
    	{
    	name:"Donald Duck",
    	city:"Duckburg"
       },
       function(data,status){
         	alert("数据：" + data + "\n状态：" + status);
       });
       $.get("/example/jquery/demo_test.asp",function(data,status){
         	alert("数据：" + data + "\n状态：" + status);
       });
       //方法二 用ajax()方法
       $.ajax({
    	type: "GET",//接口类型
    	url: "test.json",
    	data: {username:$("#username").val(), content:$("#content").val()}, //以任意格式都可以
    	dataType: "json",
    	async: true//同步或异步
    	success: function(data){
    		$('#resText').empty();   //注意有时可能需要清空内容
        },
        error: function (data) {
        	console.log("error");
        },
        complete: function (data) {
        	console.log("complete);
        }
    });

  14. 入职时间

    年后