前端笔记，面试题！

1、页面导入样式时，使用link和@import有什么区别？

	区别：
	1.link是HTML标签，@import是css提供的。
	2.link引入的样式页面加载时同时加载，@import引入的样式需等页面加载完成后再加载。
	3.link没有兼容性问题，@import不兼容ie5以下。
	4.link可以通过js操作DOM动态引入样式表改变样式，而@import不可以。

2、用递归算法实现，数组长度为5且元素的随机数在2-32间不重复的值

	var arr = new Array(5);
	function insertRandom(n) {
	  if (n < 0) return
	  let tmp = Math.floor(Math.random() * 31 + 2)
	  if (arr.indexOf(tmp) !== -1) return insertRandom(n)
	  arr[n] = tmp
	  return insertRandom(n - 1)
	}
	insertRandom(arr.length - 1)

3、写一个方法去掉字符串中的空格

	string.split(' ').join('')

4、在页面上隐藏元素的方法有哪些？

	占位:
		visibility: hidden;
		margin-left: -100%;
		opacity: 0;
		transform: scale(0);
	不占位:
		display: none;
		width: 0; height: 0; overflow: hidden;
	仅对块内文本元素:
		text-indent: -9999px;
		font-size: 0;

5、写一个方法把下划线命名转成大驼峰命名

	function changeStr(str){
	   if(str.split('_').length==1)return;
	   str.split('_').reduce((a,b)=>{
	     return a+b.substr(0,1).toUpperCase() + b.substr(1)
	   })
	}

6、CSS选择器有哪些？哪些属性可以继承？

	选择器：
		通配符
		id
		class
		标签
		后代选择器
		子选择器
		兄弟选择器
		属性选择器
		伪类选择器
		伪元素选择器
	可以继承的属性：
		font-size
		font-weight
		font-style
		font-family
		color

7、写一个把字符串大小写切换的方法

	let str = 'aBcDeFgH'
	let arr = []
	for(let item of str) {
	  if (item === item.toUpperCase()) {
	    item = item.toLowerCase()
	  } else {
	    item = item.toUpperCase()
	  }
	  arr.push(item)
	}
	let newStr = arr.join('')
	console.log(newStr)
	// AbCdEfGh

8、简述超链接目标属性的取值和作用

a标签的target属性一共有四个值。
	
	_self：默认属性。在当前窗口或框架中加载目标文档。
	
	_blank：在使用这个属性时，最好添加rel="noopener norefferrer"属性，防止打开新窗口对原窗口进行篡改。防止window.openerAPI的恶意行为。
	
	_parent：在frame或者iframe中使用较多。在父级框架中载入目标文档，当a标签本身在顶层时，与_self相同。
	
	_top：在frame或者iframe中使用裂缝。直接在顶部的框架中加载目标文档，加载整个窗口。

9、用css创建一个三角形

	width: 0;
	height: 0;
	margin: 100px auto;
	border-top: 50px solid transparent;
	border-left: 50px solid transparent;
	border-right: 50px solid transparent;
	border-bottom: 50px solid red;

10、统计某一字符或字符串在另一个字符串中出现的次数

	var childInNums = parent.split(child).length - 1；

未完待续，长期更新，如有疑问，欢迎留言！