掌握
JS:
$ 符的作用
用于初始化页面的类似于js中的load!
1.闭包
闭包就是能够读取其他函数内部变量的函数。
Js代码
function f1(){
n=999;
function f2(){
alert(n);
}
return f2;
}
var result=f1();
result(); // 999
2.跨域
跨域问题是由于javascript语言安全限制中的同源策略造成的.
同源策略是指一段脚本只能读取来自同一来源的窗口和文档的属性,这里的同一来源指的是主机名、协议和端口号的组合.
在HTML DOM中,Script标签是可以跨域访问服务器上的数据的.因此,可以指定script的src属性为跨域的url,从而实现跨域访问.
( 2.通过jquery的jsonp的方式)
3.作用域
( 变量的作用域无非就是两种:全局变量和局部变量。另一方面,在函数外部自然无法读取函数内的局部变量。 子对象会一级一级地向上寻找所有父对象的变量。所以,父对象的所有变量,对子对象都是可见的,反之则不成立。 )
4.继承
类继承和原型继承两种
5.封装
6. js / jquery 同步异步
1 异步请求:
async的定义和用法(是HTML5的属性)
async 属性规定一旦脚本可用,则会异步执行。
注释:async 属性仅适用于外部脚本(只有在使用 src 属性时)。
注释:有多种执行外部脚本的方法:
?如果 async="async":脚本相对于页面的其余部分异步地执行(当页面继续进行解析时,脚本将被执行)
?如果不使用 async 且 defer="defer":脚本将在页面完成解析时执行
?如果既不使用 async 也不使用 defer:在浏览器继续解析页面之前,立即读取并执行脚本
1.1 $.ajax
$.ajax({
url : 'your url',
data:{name:value},
cache : false,
async : true,
type : "POST",
dataType : 'json/xml/html',
success : function (result){
do something....
}
});
2 同步请求
2.1 $.ajax
$.ajax({
url : 'your url',
data:{name:value},
cache : false,
async : false,
type : "POST",
dataType : 'json/xml/html',
success : function (result){
do something....
}
});
7. JS框架有哪些
目前来看,JS框架以及一些开发包和库类有如下几个,Dojo 、Scriptaculous 、Prototype 、yui-ext 、Jquery 、Mochikit、mootools 、moo.fx
Dojo是目前最为强大的j s框架
7. 用过nodeJs哪些插件
全文检索引擎 , 缩略图功能
8. 对象 ?
9. 类 ?
10. 定时器?
在javascritp中,有两个关于定时器的专用函数,分别为:
1.倒计定时器:timename=setTimeout("function();",delaytime);
2.循环定时器:timename=setInterval("function();",delaytime);
setTimeout("function",time) 设置一个超时对象
setInterval(expression,delayTime),每个DelayTime,都将执行Expression.常常可用于刷新表达式.
setInterval("function",time) 设置一个超时对象
SetInterval为自动重复,setTimeout不会重复。
clearTimeout(对象) 清除已设置的setTimeout对象
clearInterval(对象) 清除已设置的setInterval对象
11. 单点登录?
12. 手机加载大量处理,处理方法?
13. 怎么样页面加载完成后 异步加载
14. JS去重
var arr = [1, 2, 2, 3, 4, 5, 6, 6]; function getArray(a) { var hash = {}, len = a.length, result = []; for (var i = 0; i < len; i++){ if (!hash[a[i]]){ hash[a[i]] = true; result.push(a[i]); } } return result; } getArray(arr); // 输出[1, 2, 3, 4, 5, 6]
DOM对象 - 就是用js获得的对象,
juqery对象 - 是用jQuery类库的选择器获得的对象。
15. PC和移动端有哪些兼容问题 ? 有什么不同?
16. 写一个年历的倒计时,格式为 YYYY-MM-DD HH-MM-SS
17. 转换字符口串和Int类型方法(牢记)
18. js包含方法
19. 清除浮动不用<div class="clear"></div> 使用在父级的CLASS怎么清除?
20. anglarJS 优点缺点 ?
21. 如何实现一个内容不多的时候占位 footer在最低部,如果上面内容发生变化的时候内容往下填充 而footer还在内部的底部 ?
22. document.ready 加载的时候为什么数据被覆盖?
23. CSS3学习,CSS3动画效果? 哪些属性
24 CSS3,JS,SVG 哪个效果处理速度快?
--- CSS3 效果好!
25 LESS,SESS 学习
26 数组方法
concat()---连接两个或更多的数组,并返回结果
join()---把数组的所有元素放入一个字符串,元素通过指定的分隔符进行分割
pop()---删除并返回数组的最后一个元素
push()---向数组的末尾添加一个或更多元素,并返回新的长度
reverse()---颠倒数组中元素的顺序
shift()---删除并返回数组的第一个元素
slice()---从某个已有的数组返回选定的元素
sort()---对数组的元素进行排序
splice()---删除数组,并向数组添加新元素
unshift()---向数组开头添加一个或更多元素,并返回新的长度
valueOf()---返回数组对象的原始值
27 JS获取移动端设备信息
28 函数绑定
29 提高网站性能的一些常用方法有哪些?
Make Fewer HTTP Requests(尽量减少HTTP请求)
Use a Content Delivery Network (使用内容分发网络(即CDN))
Add an Expires Header(添加Expires头)
Gzip Components (压缩组件)
Put Stylesheets at the Top(把CSS放在HTML最上面)
Put Scripts to the Bottom (把脚本(比如JavaScript)放到HTML最下面)
Avoid CSS Expressions(避免使用CSS表达式)
Make JavaScript and CSS External(使用外部的JavaScript和CSS)
Reduce DNS Lookups (减少DNS查询次数)
Minify JavaScript(精简JavaScript)
Avoid Redirects (避免重定向)
Remove Duplicate Scripts(删除重复代码)
Configure ETags (配置ETag)
Make Ajax Cacheable(使用Ajax缓存)
28.JS与Jquery的事件委托
on,bind,live
$(function(){ $('#ul1,#ul2').delegate('li','click',function(){ if(!$(this).attr('s')) { $(this).css('background','red'); $(this).attr('s',true); }else { $(this).css('background','#fff'); $(this).removeAttr('s'); } }) });
29. 事件冒泡
什么是JS事件冒泡?:
在一个对象上触发某类事件(比如单击onclick事件),如果此对象定义了此事件的处理程序,那么此事件就会调用这个处理程序,如果没有定义此事件处理程序或者事件返回true,那么这个事件会向这个对象的父级对象传播,从里到外,直至它被处理(父级对象所有同类事件都将被激活),或者它到达了对象层次的最顶层,即document对象(有些浏览器是window)。
如何来阻止Jquery事件冒泡?
通过一个小例子来解释
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default5.aspx.cs" Inherits="Default5"%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>Porschev---Jquery 事件冒泡</title> <script src="jquery-1.3.2-vsdoc.js" type="text/javascript"></script> </head> <body> <form id="form1" runat="server"> <div id="divOne" onclick="alert('我是最外层');"> <div id="divTwo" onclick="alert('我是中间层!')"> <a id="hr_three" href="http://www.baidu.com" mce_href="http://www.baidu.com" onclick="alert('我是最里层!')">点击我</a> </div> </div> </form> </body> </html>
由此可以看出:
1.event.stopPropagation();
事件处理过程中,阻止了事件冒泡,但不会阻击默认行为(它就执行了超链接的跳转)
2.return false;
事件处理过程中,阻止了事件冒泡,也阻止了默认行为(比如刚才它就没有执行超链接的跳转)
30. js apply call 区别
1、方法定义
call方法:
语法:call([thisObj[,arg1[, arg2[, [,.argN]]]]])
定义:调用一个对象的一个方法,以另一个对象替换当前对象。
说明:
call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。
如果没有提供 thisObj 参数,那么 Global 对象被用作 thisObj。
apply方法:
语法:apply([thisObj[,argArray]])
定义:应用某一对象的一个方法,用另一个对象替换当前对象。
说明:
如果 argArray 不是一个有效的数组或者不是 arguments 对象,那么将导致一个 TypeError。
如果没有提供 argArray 和 thisObj 任何一个参数,那么 Global 对象将被用作 thisObj, 并且无法被传递任何参数。
function add(a,b) { alert(a+b); } function sub(a,b) { alert(a-b); } add.call(sub,3,1);
ECMAScript规范给所有函数都定义了Call()与apply()两个方法,call与apply的第一个参数都是需要调用的函数对象,在函数体内这个参数就是this的值,剩余的参数是需要传递给函数的值,call与apply的不同就是call传的值可以是任意的,而apply传的剩余值必须为数组。
例如:function add(a, b) { return a + b; }
function sub(a, b) { return a - b; }
/*apply用法
* var a1 = sub.apply(add, [4, 2]);
*var a2= add.apply(sub, [4, 2]);
*/
var a1 = sub.call(add, 4, 2);
var a2= add.call(sub, 4, 2);
输出:a1=2 a2=6
感觉还是有意未尽,更有意思的还在下面
js总是认为他是万能的,既然高级语言会继承,我js也不能示弱:JS模仿继承
function fun1() {
this.a = 123;
this.add = function () { return this.a }
}
function fun2() {
this.a = 456;
}
var f1=new fun1()
var f2=new fun2()
var a = f1.add.call(f2); // a输出的是456
这里就是把啊f1的方法拿给f2来使用,f2便可以使用f1中所有的方法,这不正是高级语言中继承的概念喽。当然根据综上可扩展出多继承,使用多个call便可以实现多继承
function fun1() {
this.add = function () { return this.a }
}
function fun2() {
this.sub = function () { return this.a-this.b }
}
function fun3() {
this.a = 10;
this.b = 2;
fun1.call(this);
fun2.call(this);
}
var f3 = new fun3()
alert(f3.add());
alert(f3.sub());如此,想要继承谁就可以继承谁,我js天下无敌 O(∩_∩)O哈哈~
感觉还是有意未尽,更有意思的还在下面
js总是认为他是万能的,既然高级语言会继承,我js也不能示弱:JS模仿继承
function fun1() {
this.a = 123;
this.add = function () { return this.a }
}
function fun2() {
this.a = 456;
}
var f1=new fun1()
var f2=new fun2()
var a = f1.add.call(f2); // a输出的是456
这里就是把啊f1的方法拿给f2来使用,f2便可以使用f1中所有的方法,这不正是高级语言中继承的概念喽。当然根据综上可扩展出多继承,使用多个call便可以实现多继承
function fun1() {
this.add = function () { return this.a }
}
function fun2() {
this.sub = function () { return this.a-this.b }
}
function fun3() {
this.a = 10;
this.b = 2;
fun1.call(this);
fun2.call(this);
}
var f3 = new fun3()
alert(f3.add());
alert(f3.sub());如此,想要继承谁就可以继承谁,我js天下无敌 O(∩_∩)O哈哈~
浙公网安备 33010602011771号