Web前端JQuery面试题(三)
1.怎么阻止冒泡过程?
stopPropagation(); // 阻止冒泡过程
2.ready()
方法和onload()
方法的区别?
onload()
方法要等页面中全部元素加载到浏览器中才执行,如果页面中存在大量图片,要等这些内容加载完毕。
ready()
方法只要页面的dom
模型加载完毕即可,就会触发ready()
。
3.请写出 ready()
相同方法?
$(document).ready(function(){});
$(function(){});
jQuery(document).ready(function(){});
jQuery(function(){});
4.bind()
方法绑定事件有了解吗?
bind(type,[data],fn);
绑定类型: blur, focus, load, resize, scroll, unload, click, dblclick, mousedown, mouseup, select, submit , keydown, keypress, keyup, error, mousemove, mouseover, mouseout, mouseenter, mouseleave, change
$("#btn").bind("click", function(){});
$(".txt").bind("focus", { msg: message }, function(event){ // 获取数据 event.data.msg });
5.写出一个映射方式?
$(function(){ $(".txt").bind({ focus: function(){}; }, { change: function() {} }) })
6.hover()
方法和toggle()
方法区别?
$("a").hover(function(){ // 执行一 }, function() { // 执行二 });
hover(over, out)
$("a").mouseenter(function(){});
$("a").mouseleave(function(){});
toggle()
方法可以依次执行函数
toggle(fn, fn2, fn3...);
7.说明unbind()
方法的使用?
unbind()
可以移除元素的绑定事件:unbind([type], [fn])
移除全部事件 unbind();
8.one()
方法和trigger()
方法的使用?
one()
方法可以将所选选的元素绑定一个触发一次的处理函数
one(type, [data], fn);
trigger()
自动执行, triggerHandler()
方法进行取消
trigger()方法 trigger(type, [data]) 所选择的元素上触发指定事件
9.请写出显示和隐藏效果代码?
document.getElementById("p").style.display = "block";
document.getElementById("p").style.display = "none";
$("p").css("display":"block");
$("p").css("display":"none");
show()和hide()方法进行显示和隐藏
show(speed,[callback]);
hide(speed,[callback]);
10.切换元素可见状态的方法?
toggle()
方法如果显示状态,就变成隐藏状态,如果是隐藏状态,就变成显示状态。
toggle()
toggle(switch)
switch
为布尔值,true
显示元素,反之隐藏
toggle(speed,[callback])
11.请写出滑动效果?
slideDown()
方法和slideUp()
方法
slideDown(speed,[callback])
slideUp(speed,[callback])
slideToggle(speed,[callback])
以动画效果切换所选择的元素
12.请写出淡入淡出效果?
fadeIn()
与fadeOut()
方法进行淡入淡出效果。
fadeIn(speed,[callback]) 实现淡入动画效果
fadeOut(speed,[callback]) 现实淡出的动画效果
fadeTo()方法给定透明度值
fadeTo(speed,opacity,[callback]);
13.简单的动画效果?
animate(params,[duration],[easing],[callback])
14.实现效果动画的停止和延时?
stop([clearQueue],[gotoEnd]) 停止正在执行的动画,clearQueue是布尔值,是否停止正在执行的动画,gotoEnd是布尔值,是否完成正在执行的动画。
delay(duration,[queueName])延时动画效果
show()和hide()方法 实现动画效果的显示和隐藏
slideUp()和slideDown() 实现“上下”的动画效果的显示和隐藏
fadeTo()实现指定的透明度的效果
toggle()方法进行切换效果,显示和隐藏
slideToggle()方法可以上下显示和隐藏的效果
animate()方法进行自定义元素的动画
15.使用animate()
方法
$("p").animate({height: "hide", width: "hide", opacity: "hide" }, 300);
$("p").hide(300);
$("p").animate({ opacity: "hide" }, 300);
$("p").fadeOut(300);
$("p").animate( {height: "hide" }, 300);
$("p").slideUp(300);
$("p").animate( {opacity: "0.8" }, 300);
$("p").fadeTo(300, "0.8");
16.什么是Ajax
呢?
Ajax
是Asynchronous JavaScript and XML
的缩写,核心是通过XMLHttpRequest
对象进行异步获取的方法,向服务器发送数据请求,通过这个对象进行接收请求返回的数据。
jquery
中的load()
方法,进行获取异步数据。
load(url, [data], [callback]);
$.getJSON(url,[data],[callback]);
$.getJSON("xxx.json", function(data){
$.each(data, function(InfoIndex, Info){
// 显示
})
})
通过全局函数getJSON()
可以获取.json
格式的文件内容
17.关于全局函数中的getScript()
通过全局函数getScript()
可以获取.js文件内容
$.getScript(url,[callback]) // 加载的js文件地址 和 加载成功时执行的回调函数
$.getScript("User.js", function() { alert("加载成功"); });
18.全局函数get()
?
$.get(url, [data], [callback], [type]) 异步获取xml文档数据
$.get()请求数据
19.安全请求数据
$.post()请求数据
$.post(url, [data], [callback], [type]);
19.序列化表单效果
serialize()方法
20.底层方法$.ajax()
?
$.ajax([options]);
$.ajaxSetup([options]);
ajaxSuccess(callback) ajax请求成功时执行
ajaxStop(callback) ajax请求结束时执行
ajaxStart(callback) ajax请求开始时执行
ajaxComplete(callback) ajax请求完成时执行函数
ajaxError(callback) ajax请求发送错误时执行函数
ajaxSend(callback) ajax请求发送前执行函数
好了,欢迎在留言区留言,与大家分享你的经验和心得。
感谢你学习今天的内容,如果你觉得这篇文章对你有帮助的话,也欢迎把它分享给更多的朋友,感谢。
作者简介
达叔,理工男,简书作者&全栈工程师,感性理性兼备的写作者,个人独立开发者,我相信你也可以!阅读他的文章,会上瘾!,帮你成为更好的自己。长按下方二维码可关注,欢迎分享,置顶尤佳。