1, 涉及 vue.js. 具体的忘了.
2, 用 JS 写出一个冒泡排序算法.
解析: 1. 比较相邻的两个元素, 如果前一个比后一个大, 则交换位置.
2. 第一轮的时候最后一个元素应该是最大的一个.
3. 按照步骤一的方法进行相邻两个元素的比较, 这个时候由于最后一个元素已经是最大的了, 所以最后一个元素不用比较.
- function bubbleSort(array){
- var len=array.length;
- var temp;
- for(var i=0;i<len-1;i++){
- for(var j=0;j<len-1-i;j++){
- if(array[j]>array[j+1]){
- temp=array[j];
- array[j]=array[j+1];
- array[j+1]=temp;
- }
- }
- }
- return array;
- }<br><br>var arr=[3,6,2,9,10,32,1];<br>console.log(arr);<br>bubbleSort(arr);<br>console.log(arr);
3,CSS 中的选择器的优先级是怎么样的? 如何优化选择器?
行内样式 (权重为 1000)> id 选择器 (权重为 100)> class 类选择器 (权重为 10)> 标签选择器 (权重为 1)
4, 前端页面的优化方法有哪些? 有什么优化工具?
优化方法:
1, 减少 Http 请求, 优化加载速度.
a, 合并文件: 将多个 Script 合成一个文件, 将多个 CSS 文件合成一个文件;
b, 使用 "雪碧图"CSS SPrites 将背景图整合到一张图片中, 通过坐标来实现对背景进行定位;
c, 减少 DOM 数量.
2,CSS:
a, 避免使用 CSS 表达式;
b, 避免使用 @import 引入 CSS 文件, 使用 link 形式引入;
c, 在头部 head 中引入 CSS 样式表文件. 因为如果把 CSS 文件放在底部, 大部分浏览器会现下载内容, 但是不能显示出来, 因为 CSS 在最底部.
3,JavaScript
a, 去除重复的脚本;
b, 尽量减少 DOM 的访问;
c,JS 脚本文件在底部 body 之前或者之后引入;
d, 将 JS,CSS 文件进行压缩, 去除中间的换行和空格等无用内容, 减小体积, 且注意 JS 和 CSS 文件的个数.
4, 图片部分
a, 优化图片
b, 不要使用 html 缩放图片, 即不要在 HTML 中对图片进行设置高度和宽度;
c, 使用小且可以存储的 favicon.ico 图标
5,cookies
a, 给 cookies 减肥;
b, 清除不必要的 cookies
c, 保证 cookies 尽量小.
优化工具:
5, 使用 HTML5 写出一个页面, 包含头部, 页头, 页脚, 文字内容和图片.
- <DOCTYPE HTML>
- <HTML>
- <head>
- <meta charset="utf-8">
- <title></title>
- </head>
- <body>
- <header>
- <h1 > 头部 </h1>
- </header>
- <nav>
- <ul>
- <li>Home</li>
- <li>About</li>
- <li>Contact</li>
- </ul>
- </nav>
- <section>
- <article>
- <h1>Internet Explorer 9</h1>
- <p>Windows Internet Explorer 9(简称 IE9) 于 2011 年 3 月 14 日发布.....</p>
- </article>
- </section>
- <figure id="fig2">
- <img alt="a picture for test" src="installdialog.jpg"/>
- </figure>
- <footer>
- <p><a href="https://i.cnblogs.com/">https://i.cnblogs.com/</a><p>
- </footer>
- </body>
- </HTML>
6, 创建子类 Child, 使用原型和构造函数的方式继承父类 People 的方法, 并调用 say 函数说出姓名和年龄.
- function People(name,age){
- this.name=name;
- this.age=age;
- this.say=function(){
- alert("我的名字是:"+this.name+"我今年"+this.age+"岁!");
- };
- }
7, 写出 Ajax(跨域使用框架, 但需说明使用了何种框架) 的跨域异步获取 JSON 数据的方法. 可以使用 JavaScript 进行跨域异步 post 数据吗?
- var url="http://www.37.com";
- $.Ajax(function(){
- type:"get";
- url:"http://www.37.com";
- dataType:"jsonp";
- JSONP:"jsoncallback";
- success:function(data){
- if(data.errorCode){
- alert("查询失败, 错误码为:"+result.errorCode);
- return;
- }
- alert(data);
- }
- error:function(){
- alert("查询失败!");
- }
- });
8, 写出日期 "2016-06-03"...... 的正则表达式 (要写的挺多的, 具体的记不清了)
9, 给 input 添加如下样式 (CSS3):
背景为图片 1.jpg, 背景颜色为蓝色; 长度 200px; 高度 50px; 文字居中显示, 边框为 5 像素虚线黑色; 边框为 5 像素圆角, 文字阴影, 模糊.
- <!doctype HTML>
- <HTML lang="en">
- <head>
- <meta charset="UTF-8">
- <title>
- Document
- </title>
- </head>
- <style>
- input{ width: 200px; height: 50px; text-align: center; border:5px dashed
- black; border-radius: 5px; background: blue url(http://p1.music.126.net/sgGJqe4_8_J94nNS2Gk2ug==/109951164796752979.jpg?imageView&quality=89);
- text-shadow: 5px 5px 3px red }
- </style>
- <body>
- <input type="text" name="test">
- </body>
- </HTML>
10, 对数组 testArray 进行以下操作:
a, 从前面删除一个数字;
b, 从前面增加一个数字 5;
c, 给数组从小到大进行排序;
d, 反转数组;
e, 在数组 61 之后加入 62,63,64
- var testArray=[3,4,61,8,1];
- testArray.shift();
- testArray.unshift(5);
- function compact(a,b){
- return a-b;
- }
- testArray.sort(compact);
- testArray.reverse();
- testArray.splice(testArray.indexOf(61)+1,0,62,63,64);
来源: http://www.bubuko.com/infodetail-3459531.html