1.给出一个数组如何去掉重复的项?
var arr = [1,2,3,4,5,6,1,5,6];
function removeRepeat(arr) {
var i,tempArr = [];
for(i in arr){ //一种for循环写法
if(tempArr.join(',').indexOf(arr[i])=== -1){
//join() 方法用于把数组中的所有元素放入一个字符串 ()传入拼接规则
//indexOf()方法可返回某个指定的字符串值在字符串中首次出现的位置 不存在的话返回 -1
tempArr.push(arr[i])
console.log(tempArr)
}
}
return tempArr;
}
console.log(removeRepeat(arr));
语言描述:首先声明一个空的数组,然后遍历数组,用join()方法把数组每个元素转换成一个字符串,同用indexOf()方法把数组的每个元素和字符串对比,如果不存在就把数组每个元素添加到空数组里保存,这样就得到了没有重复的数组了
2. DOM 对象转成 jQuery 对象
对于已经是一个 DOM 对象,只需要用 $() 把 DOM 对象包装起来,就可以获得一个 jQuery 对象了,$(DOM 对象)
如: var v = document.getElementById("v"); //DOM 对象
var $v = $(v); //jQuery 对象
转换后,就可以任意使用 jQuery 的方法。
3. jQuery 对象转成 DOM 对象
(1) jQuery 对象是一个数据对象,可以通过 [index] 的方法,来得到相应的 DOM 对象(描述)
var $v = $("#v");
console.log($v);//假设这个是个数组对象
var v = $v[0];
console.log(v);
(2) jQuery 本身提供,通过.get(index) 方法得到相应的 DOM 对象(描述)
var $v = $("#v");
var v = $v.get(0); // get()方法获得由选择器指定的 DOM 元素。
console.log(v);
4.jq 常见选择器?
$("*") 匹配页面所有元素
$("#id") id选择器
$(".class") class选择器
$("div") 标签选择器
扩展
$("p:first") first选择器
$("p:last") last选择器
$("p:odd") odd选择器 奇数选择器 [ɑd]
$("p:even") even选择器 偶数选择器
5.bind 和 live 的区别?
live方法其实是bind方法的变种,其基本功能就同bind方法的功能是一样的,都是为一个元素绑定某个事件,但是bind方法只能给当前存在的元素绑定事件,对于事后采用JS等方式新生成的元素无效,而live方法则正好弥补了bind方法的这个缺陷,它可以对后生成的元素也可以绑定相应的事件。
自己理解:
(1)$("div").bind("click",function(){});
(2)$("div").live("click",function(){});
bind执行绑定事件是只对绑在当前标签上生效,而对后来的标签比如父标签不生效
live执行绑定事件不仅仅对当前标签上生效,对后来的标签也生效
6.this指向问题
看这个网页详解
https://www.cnblogs.com/pssp/p/5216085.html
6对象取值
var obj = {T1:[{'naem' : 'jack'},{'naem' : 'jack'},{'naem' : 'jack'}]}
console.log(obj.T1) //拿到数组
7 学习不知道的新东西的方法
{
1. 菜鸟教程:
http://www.runoob.com/ 或者 W3school
http://www.w3school.com.cn/
2. (备用)
http://www.w3cplus.com/
3.
github.com
去搜索你要的东西, 然后点进去可能会有API
4.
npmjs.com 去搜索你要的东西, 注意看更新日期和星数.
}
8 vue生命周期
它可以总共分为8个阶段:
beforeCreate(创建前),
created(创建后),
beforeMount(载入前),
mounted(载入后),
beforeUpdate(更新前),
updated(更新后),
beforeDestroy(销毁前),
destroyed(销毁后)
9.React脚手架搭建
npm init react-app react-my
安装router模块
npm install --save react-router-dom
安装axios模块
npm install --save react-router-dom
{this.state.obj.map((item,index)=>{
return <div style={div_text}>
<img style={img} src={'https://images.weserv.nl/?url='+ item.cover.url} alt=""/>
<div>
{item.title}
</div>
</div>
})
}
map是遍历数组方法,不能遍历对象
'https://images.weserv.nl/?url='+ item.cover.url
其实是豆瓣限制了图片的加载,我自己用了一个办法把图片缓存下来:
只要在请求到的图片链接前面加上‘https://images.weserv.nl/?url=’即可(注:这是一个专门缓存图片的网址),可能会有点慢。
10. div居中问题
水平垂直居中
《方法1》
<div id="" style="background-color:blue;width:100%;height: 500px;position: relative;">
<div style="background-color: red;width: 300px;height: 200px;position: absolute;top: 50%;left:50%;margin-top: -100px;margin-left: -150px;">
</div>
</div>
《方法2》
<div id="" style="background-color:green;width:100%;height: 500px;position: relative;">
<div style="background-color: red;width: 300px;height: 200px;position: absolute;left:0;top: 0;bottom: 0;right: 0;margin:auto">
</div>
</div>
水平居中
<div id="" style="background-color:#000022;width:100%;height: 500px;">
<div style="background-color: red;width: 300px;height: 200px;margin:0 auto;">
</div>
</div>
11. 颜色表示对方法
① rgb(0,255,0), ② 通过十六进制(Hex)的颜色值排序 #00FF00 ③英文单词表示 比如red,white
12.图片、文字居中问题
图片垂直居中
<div style="height: 600px;line-height: 600px">
<img src="img/QQ拼音截图20180917143211.png" alt="" style="vertical-align: middle">
</div>
文字水平垂直居中
<div style="height: 600px;line-height: 600px;text-align: center">
<span>傻瓜不会死它</span>
</div>
图片水平垂直居中
给div设定text-align:center;可使图片水平居中,再给图片img设定 vertical-align:middle;即可达到垂直居中(切记,是给图片加,不是div,很多人容易搞错)
<div style="height: 600px;line-height: 600px;text-align: center">
<img src="img/QQ拼音截图20180917143211.png" alt="" style="vertical-align: middle">
</div>
13.
1.解释一下display的几个常用的属性值,inline , block, inline-block
- inline:
-
- 使元素变成行内元素,拥有行内元素的特性,即可以与其他行内元素共享一行,不会独占一行.
- 不能更改元素的height,width的值,大小由内容撑开.
- 可以使用padding,margin的left和right产生边距效果,但是top和bottom就不行.
- block:
-
- 使元素变成块级元素,独占一行,在不设置自己的宽度的情况下,块级元素会默认填满父级元素的宽度.
- 能够改变元素的height,width的值.
- 可以设置padding,margin的各个属性值,top,left,bottom,right都能够产生边距效果.
- inline-block:
-
- 结合了inline与block的一些特点,结合了上述inline的第1个特点和block的第2,3个特点.
- 用通俗的话讲,就是不独占一行的块级元素。如图:
14.字体适配问题
viewpoint
css3提供了一些与当前viewpoint相关的元素,vw,vh,vim等。
“viewpoint” = window size vw = 1% of viewport width 1vh = 1% of viewport height 1vmin = 1vw or 1vh, 最小 1vmax = 1vw or 1vh, 最大
兼容性:chrome 20+/ safari 6+/ IE 10+ / FF 19+ / IOS 6+
15.http状态码意思:
401 查看得知:401 - 未授权: 由于凭据无效,访问被拒绝。代码其中一块需要读写文件,已经去掉只读,然后授权iis_users读写,解决问题。
404 网页不存在
16,谈谈MVC MVVM
https://blog.csdn.net/qq_36228442/article/details/79470408
MVC是一种开发模式,就是一种模型—视图—控制器(MVC)模式。
mvvm的设计思想主要实现页面和数据模型的同步,当view改变的时候会自动将数据同步到model,model改变的时候也会自动将数据同步到view,更新view的动态显示,Model可以简单理解为与网页关联的本地数据引擎。
https://segmentfault.com/a/1190000010756245
MVVM在vue里面使用最多 就是一种模型—视图—视图模型器(MVVC)模式。
<!--
帮助我们理解 MVVM M - model V - Val
Val 要在data内定义
-->
<input type="text" v-model="Val">
<h3>{{Val}}</h3>
使用v-model指令去绑定data里面的key名为Val,然后在h3标签里引入{{Val}}
MVVM与MVC最大的区别就是:它实现了View和Model的自动同步,也就是当Model的属性改变时,我们不用再自己手动操作Dom元素,来改变View的显示,而是改变属性后该属性对应View层显示会自动改变。非常的神奇~
整体看来,MVVM比MVC精简很多,不仅简化了业务与界面的依赖,还解决了数据频繁更新的问题,不用再用选择器操作DOM元素。因为在MVVM中,View不知道Model的存在,Model和ViewModel也观察不到View,这种低耦合模式提高代码的可重用性。
JavaScript的三个主要组成部分https://blog.csdn.net/qq_36647038/article/details/80315062
17、JavaScript中的3种弹出式消息提醒的命令是什么? - alert():带确认按钮的对话框,点击确认按钮,对话框关闭; - confirm():带有确认和取消按钮的对话框,点击确认和取消按钮都会关闭对话框,只是会返回不同的boolean值,然后可以根据boolean值执行不同的操作; - prompt():带有确认和取消按钮,还带有输入框
18、float和position:absolute脱离文本流的区别
CSS中脱离文档流,也就是将元素从普通的布局排版中拿走,其他盒子在定位的时候,会当做脱离文档流的元素不存在而进行定位。
需要注意的是,使用float脱离文档流时,其他盒子会无视这个元素,但其他盒子内的文本依然会为这个元素让出位置,环绕在周围。
而对于使用absolute positioning脱离文档流的元素,其他盒子与其他盒子内的文本都会无视它 --------