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])
<script type="text/javascript">
$(function(){
$("p").click(function(){
$(this).animate({height: 100}, "slow")
.animate({width:100},"slow")
.animate({height:50},"slow")
.animate({width:50},"slow");
})
})
</script>

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呢?

AjaxAsynchronous 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文件地址 和 加载成功时执行的回调函数
<script type="text/javascript">
$(function(){
$("#btn").click(function(){
$.getScript("User.js");
})
})
</script>
$.getScript("User.js", function() { alert("加载成功"); });

18.全局函数get()

$.get(url, [data], [callback], [type]) 异步获取xml文档数据
$.get()请求数据

19.安全请求数据

$.post()请求数据
$.post(url, [data], [callback], [type]);

19.序列化表单效果

serialize()方法

<script type="text/javascript">
$("#btn").click(function(){
$.post("User.aspx", $("#formUser").serialize(),
function(data) {
$("div").empty.html(data);
})
})
</script>

20.底层方法$.ajax()?

$.ajax([options]);
$.ajaxSetup([options]);
ajaxSuccess(callback) ajax请求成功时执行
ajaxStop(callback) ajax请求结束时执行
ajaxStart(callback) ajax请求开始时执行
ajaxComplete(callback) ajax请求完成时执行函数
ajaxError(callback) ajax请求发送错误时执行函数
ajaxSend(callback) ajax请求发送前执行函数

结言

好了,欢迎在留言区留言,与大家分享你的经验和心得。

感谢你学习今天的内容,如果你觉得这篇文章对你有帮助的话,也欢迎把它分享给更多的朋友,感谢。

作者简介

达叔,理工男,简书作者&全栈工程师,感性理性兼备的写作者,个人独立开发者,我相信你也可以!阅读他的文章,会上瘾!,帮你成为更好的自己。长按下方二维码可关注,欢迎分享,置顶尤佳。

Web前端JQuery面试题(三)的更多相关文章

  1. Web前端JQuery面试题(二)

    Web前端JQuery面试题(二) 1.请写出jquery的语法? <script type="text/javascript"> $(document).ready( ...

  2. Web前端JQuery面试题(一)

    Web前端JQuery面试题(一) 一:选择器 基本选择器 什么是#id,element,.class,*,selector1, selector2, selectorN? 答: 根据给定的id匹配一 ...

  3. web前端整套面试题(三)--网易的面试题

    题型分析: 一.选择题部分(30分) 元素出栈可能性 排序方法的优缺点 HTTP请求方法 关系型数据库种类 多线程(进程与线程共享) 计算机网络协议 linux指令 JQuery实现方法 二.编程题( ...

  4. Web前端面试笔试题总结

    最近一段时间要毕业了,忙着找工作,见过不少笔试面试题,自己总结了一些加上网上找的一些整合了一下.答案暂时都东拼西凑出来了,但是还是先不发出来,一方面是答案并不是唯一的并且自己的答案不能保证对,另一方面 ...

  5. web前端经典面试题大全及答案

    阅读目录 JavaScript部分 JQurey部分 HTML/CSS部分 正则表达式 开发及性能优化部分 本篇收录了一些面试中经常会遇到的经典面试题以及自己面试过程中遇到的一些问题,并且都给出了我在 ...

  6. 【理论面试篇】收集整理来自网络上的一些常见的 经典前端、H5面试题 Web前端开发面试题

    ##2017.10.30收集 面试技巧 5.1 面试形式 1)        一般而言,小公司做笔试题:大公司面谈项目经验:做地图的一定考算法 2)        面试官喜欢什么样的人 ü  技术好. ...

  7. 【编码题篇】收集整理来自网络上的一些常见的 经典前端、H5面试题 Web前端开发面试题

    编写一个方法 求一个字符串的字节长度假设:一个英文字符占用一个字节,一个中文字符占用两个字节 function GetBytes(str){ var len = str.length; var byt ...

  8. Python之Web前端jQuery扩展

    Python之Web前端: 一. jQuery表单验证 二. jQuery扩展 三. 滚动菜单 一. jQuery表单验证: 任何可以交互的站点都有输入表单,只要有可能,就应该对用户输入的数据进行验证 ...

  9. web前端-----jQuery

    web前端之jQuery篇 一 jQuery是什么? [1]   jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多 javascript高手加入其team. [2]   j ...

随机推荐

  1. 意想不到的的异常-由于eclipse和tomcat的交互出错-eclipse断点导致debug启动缓慢

    足足启动了200多秒,正赶上hibernate 的使用上全部换使用方式,修改了很多代码.赶在这个节骨点上,出现debug 启动时卡在hibernate 启动的地方不动了,也没掉到debug断点的地方. ...

  2. MongoDB的Replica Set以及Auth的配置

    http://blog.0x01.site/2017/01/13/MongoDB%E7%9A%84Replica-Set%E4%BB%A5%E5%8F%8AAuth%E7%9A%84%E9%85%8D ...

  3. 泡泡堂BNB[ZJOI2008]

    --BZOJ1034 Description 第XXXX届NOI期间,为了加强各省选手之间的交流,组委会决定组织一场省际电子竞技大赛,每一个省的代表队由n名选手组成,比赛的项目是老少咸宜的网络游戏泡泡 ...

  4. zxlizsm

    好久没发表了,毕业之后就没回来过!

  5. [Hadoop]Hadoop章3 NameNode的ZKFC机制

    基本概念 首先我们要明确ZKFC 是什么,有什么作用: zkfc是什么? ZooKeeperFailoverController 它是什么?是Hadoop中通过ZK实现FC功能的一个实用工具. 主要作 ...

  6. Django 中文和时区设置

    Django 语言和时区的设置都在 settings.py 文件中. 中文设置 LANGUAGE_CODE:设置语言,英语 en-us,中文简体 zh-Hans,中文繁体 zh-Hant 在 MIDD ...

  7. AHOI——Day1个人感悟

    今天,是个bilibili的日子.(嗯?什么意思?) 洛谷已经尽力了: 于是我带着洛谷的祝福,来到了AHOI的考场--合肥一中. 其实我是考完才签到的,我一大早五点多就起来了,到考场后,在肯德基吃了早 ...

  8. mysql时间戳转换

    数据表中time是时间戳格式,转化成正常的时间格式 SELECT id,TIME,FROM_UNIXTIME(TIME,'%Y-%m-%d %H:%m:%S'),incline_id FROM inc ...

  9. web安全系列2:http初探

    web安全系列的第二篇 首先,我们先来理解两个名词C/S架构和B/S架构. 所谓C/S架构,就是客户机/服务器架构,而B/S架构就是浏览器/服务器架构.C/S是通常的桌面程序的架构方式,而B/S就是网 ...

  10. 关于String类学习的一些笔记(本文参考来自程序员考拉的文章)

    String 类继承自 Object 超类,实现的接口有:Serializable.CharSequence.Comparable<String> 接口,具体如下图: 一.常用的Strin ...