web前端面试题
第一部分 JavaScript
1、JavaScript中如何检测一个变量是一个String类型?
1 typeof(obj) === "string"
2、去除给定的字符串空格?
1 //方法一:使用replace正则匹配的方法 2 var str = " 233 48 5 "; 3 // var str2 = str.replace(/\s*/g,""); //去除所有空格 4 // var str2 = str.replace(/^\s*|\s*$/g,""); //去除首尾两端空格 5 // var str2 = str.replace(/(\s*$)/g,""); //去除右端空格 6 // var str2 = str.replace(/^\s*/,""); //去除左边解空格 7 8 // 方法二:使用str.trim()方法 缺点:无法去除中间的空格 9 var str2 = str.strim();
3、获取浏览器URL中查询字符串中的参数
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 // 测试地址为:http://www.runoob.com/jquery/misc-trim.html?channelid=12333&name=xiaoming&age=23 2 function showWindowHref(){ 3 var sHref = window.location.href; 4 var args = sHref.split('?'); 5 if(args[0] == sHref){ 6 return ""; 7 } 8 var arr = args[1].split('&'); 9 var obj = {}; 10 for(var i = 0;i< arr.length;i++){ 11 var arg = arr[i].split('='); 12 obj[arg[0]] = arg[1]; 13 } 14 return obj; 15 } 16 var href = showWindowHref(); // obj 17 console.log(href['name']); // xiaoming
4、js中常见的字符串操作函数
concat() – 将两个或多个字符的文本组合起来,返回一个新的字符串。
indexOf() – 返回字符串中一个子串第一处出现的索引。如果没有匹配项,返回 -1 。
charAt() – 返回指定位置的字符。
lastIndexOf() – 返回字符串中一个子串最后一处出现的索引,如果没有匹配项,返回 -1 。
match() – 检查一个字符串是否匹配一个正则表达式。
substr() 函数 -- 返回从string的startPos位置,长度为length的字符串
substring() – 返回字符串的一个子串。传入参数是起始位置和结束位置。
slice() – 提取字符串的一部分,并返回一个新字符串。
replace() – 用来查找匹配一个正则表达式的字符串,然后使用新字符串代替匹配的字符串。
search() – 执行一个正则表达式匹配查找。如果查找成功,返回字符串中匹配的索引值。否则返回 -1 。
split() – 通过将字符串划分成子串,将一个字符串做成一个字符串数组。
length – 返回字符串的长度,所谓字符串的长度是指其包含的字符的个数。
toLowerCase() – 将整个字符串转成小写字母。
toUpperCase() – 将整个字符串转成大写字母。
5、怎样添加、移除、移动、复制、创建和查找节点?
1)创建新节点
createDocumentFragment() //创建一个DOM片段
createElement() //创建一个具体的元素
createTextNode() //创建一个文本节点
2)添加、移除、替换、插入
appendChild() //添加
removeChild() //移除
replaceChild() //替换
insertBefore() //插入
3)查找
getElementsByTagName() //通过标签名称
getElementsByName() //通过元素的Name属性的值
getElementById() //通过元素Id,唯一性
6、写出3个使用this的典型应用
(1)、在html元素事件属性中使用,如:
<input type=”button” onclick=”showInfo(this);” value=”点击一下”/>
(2)、构造函数
1 function Animal(name, color) { 2 this.name = name; 3 this.color = color; 4 }
(3)、input点击,获取值
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <input type="button" id="text" value="点击一下" /> 2 <script type="text/javascript"> 3 var btn = document.getElementById("text"); 4 btn.onclick = function() { 5 alert(this.value); //此处的this是按钮元素 6 } 7 </script>
(4)、apply()/call()求数组最值
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 var numbers = [5, 458 , 120 , -215 ]; 2 var maxInNumbers = Math.max.apply(this, numbers); 3 console.log(maxInNumbers); // 458 4 var maxInNumbers = Math.max.call(this,5, 458 , 120 , -215); 5 console.log(maxInNumbers); // 458
7、编写一个方法 去掉一个数组的重复元素
![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 var arr = [2,3,4,4,5,2,3,6], 2 arr2 = []; 3 for(var i = 0;i< arr.length;i++){ 4 if(arr2.indexOf(arr[i]) < 0){ 5 arr2.push(arr[i]); 6 } 7 } 8 console.log(arr2);
jquery
1、 jQuery 库中的 $() 是什么?
$() 函数是 jQuery() 函数的别称。$() 函数用于将任何对象包裹成 jQuery 对象,接着你就被允许调用定义在 jQuery 对象上的多个不同方法。你可以将一个选择器字符串传入 $() 函数,它会返回一个包含所有匹配的 DOM 元素数组的 jQuery 对象。
2、如何找到所有 HTML select 标签的选中项?
$('[name=selectname]:selected')
3、$(this) 和 this 关键字在 jQuery 中有何不同?
$(this) 返回一个 jQuery 对象,你可以对它调用多个 jQuery 方法,比如用 text() 获取文本,用val() 获取值等等。而 this 代表当前元素,它是 JavaScript 关键词中的一个,表示上下文中的当前 DOM 元素。你不能对它调用 jQuery 方法,直到它被 $() 函数包裹,例如 $(this)。
4、jquery怎么移除标签onclick属性?
获得a标签的onclick属性: $("a").attr("onclick")
删除onclick属性:$("a").removeAttr("onclick");
设置onclick属性:$("a").attr("onclick","test();");
5、
5、jquery中addClass,removeClass,toggleClass的使用。
$(selector).addClass(class):为每个匹配的元素添加指定的类名
$(selector).removeClass(class):从所有匹配的元素中删除全部或者指定的类,删除class中某个值;
$(selector).toggleClass(class):如果存在(不存在)就删除(添加)一个类
$(selector).removeAttr(class);删除class这个属性;