又到了一年一度的毕业季了,青春散场,却等待下一场开幕。

在求职大军中,IT行业的程序员、码农是工科类大学生的热门选择之一,

尤其是近几年Web的如火如荼,更是吸引了成千上万的程序员投身其中追求自己的梦想,

这篇文章以Web面试官的经历整理而成,希望能对你有所帮助。

jQuery是什么?

jQuery是javascript编写一个可重用的JavaScript库。

不使用jQuery设置UI文本的JavaScript代码如下:

document.getElementById("txt1").value = "hello";

用jQuery类库后的的JavaScript代码如下:

$("#txt1").val("Hello");

可见,在使用jQuery类库后的JavaScript代码明显简洁了很多,也更符合IT行业特点:短、平、快。

jquery与JavaScript的关系,jQuery会取代JavaScript吗?

JavaScript:是一门Web最流行的脚本语言。

jQuery: 是一个优秀的Javascript框架。它是轻量级的js库 ,它兼容CSS3,还兼容各种浏览器(IE 6.0+, FF 1.5+, Safari  2.0+, Opera 9.0+)。

故,jQuery是并不是要取代的JavaScript;使用JQuery使Web开发变得简单。

如何使用jQuery库?

从jquery.com下载的jquery.js文件(最新的JQuery版本V1.11.1或V2.1.1)。 jQuery的文件规则,如“jquery-1.4.1.j s”,其中1.4.1是JS文件的版本的版本号。

在开发Web程序前,需要包含的JavaScript,如图下面的代码:

<script src="file:///C:/jquery-1.11.1.min.js" type="text/javascript"></script>

CDN(内容分发网络)是什么?

在开发Web页面,考虑最多的问题之一是页面在客户端电脑的响应:时间越短,用户体验越好。

而制约用户体验的关键因素之一是浏览器下载Web文件大小,包括*.html、图片、*.js、*.css等文件。

为了最大化复用和节约带宽,故CDN应运而生:其基本思路是尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节,使内容传输的更快、更稳定。其目的是使用户可就近取得所需内容,解决 Internet网络拥挤的状况,提高用户访问网站的响应速度。

如何使用jQuery CDN?

推荐使用官方的CDN节点,使用代码如下:

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>

还有Google提供的jQuery CDN:

<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js">
</script>

同时微软也提供了jQuery CDN的节点:

<script type="text/javascript"
src="http://ajax.microsoft.com/ajax/jquery/jquery-1.9.1.min.js">
</script>

如何在CDN网络不可访问情况下,能自动访问网站的jQuery文件?

一般情况下,CDN网络节点是可靠的。

但是偶尔也有失灵的时候,故为了提供双保险,可进行判断网络加载CDN失败,则自动加载网站上的JQuery

, 示例代码如下:

<script type="text/javascript" src="http:/ajax.microsoft.com/ajax/jquery/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
if (typeof jQuery == 'undefined')
{
document.write(unescape("%3Cscript src='Scripts/jquery.1.9.1.min.js' type='text/javascript'%3E%3C/script%3E"));
}
</script>

同版本的jQuery.js文件和jQuery.min.js有何不同?

相同

这两个文件提供相同的jQuery的功能,即在函数调用上没有区别。

不同

jQuery.js文件,适合让程序员阅读,如下图所示:

jQuery.min.js文件,通过压缩和删除所有的空格,以节省带宽和空间,使得文件更小,用于网络传输,不适合程序员阅读。

何时使用jQuery.js,何时使用jQuery.min.js?

开发调试场景下:用jQuery.js文件,因为你想调试,能够看到javascript代码。

生产部署环境下:用jQuery.min.js文件,可减少网络宽度,加快网页加载速度。

jQuery.vsdoc.js文件是什么?

*.vsdoc.js文件是用来在微软的开发环境Visual Studio下使用的,方便得获得jQuery的智能感知,当你输入jQuery函授后,会自动提示函数的类型、函数使用说明、函数参数等等。

如果在VS下用jQuery开发Web程序,则vsdoc.js文件会大大的提高开发效率。

jQuery的基本语法如何解释?

jQuery的语法结构可以分为四部分:

  1. 默认情况下,所有Jquery的命令开始以一个“$”符号。
  2. 其次是HTML元素的选择。例如下面是我们通过ID“txt1”选择一个HTML文本框。
  3. 接着由点(.)分隔。这个操作者将分离的元素和该元素的动作(函数)。
  4. 最后什么样的函数(动作)。

例如在下面的jQuery代码,我们正在设置的文本值为“Hello world, jQuery”。

在jQuery中,“$”符号代表什么?

在jQuery中,“$”符号是一个jQuery的别名,默认的jQuery类库以$开头。

为何要使用jQuery.noConflict()

有很多类似jQuery一样的类库,如MooTools, Backbone, Sammy, Cappuccino, Knockout 。这些类库中,有的也使用了$符号,如果同时使用,则会导致命名冲突。

为了解决这个冲突,需要用到jQuery.noConflict(),这样就不依赖$这个默认符号了。
   例如:

$.noConflict();
jQuery("p").text("I am jquery and I am working&hellip;");

或者使用别名代替:

var jq = $.noConflict();
jq("p").text("I am invoked using jquery shortcut&hellip;");

请举例说明jQuery的选择器

选择所有HTML的p元素,并隐藏

$("p").hide();

选择ID为Text1的HTML元素,并赋值

$("#Text1").val("Hello");

选择Class为Text1dHTML元素,并赋值

$(".Text1").val("Hello");

在jQuery中,如何使用document.ready?

一次完整的HTML DOM加载完成,会触发HTML的“document.ready”事件,而要通过JQuery访问HTML元素,则需要页面的HTML元素加载完成。

例如:

<script>
$("#text1").val("Sometext"); // 报错。因为text1此刻未加载完成,无法访问
</script>
</head>
<body>
<input type="text" id="text1" />
</body>

而在Ready事件中的可访问HTML元素,例子如下:

<script>
$(document).ready(function(){
$("#text1").val("Sometext");
});
</script>

同一个页面中,能否加载多个个document.ready事件?

可以。

如何用jQuery对HTML元素事件进行附加?

下面通过2个例子来说明

例子1,选择所有的button元素,在其click事件中,对所有p元素进行toggle。

$("button").click(function(){
$("p").toggle();
});

例子2,选择ID为p1的元素,在mouseenter事件中,进行alert。

$("#p1").mouseenter(function(){
alert("You entered p1!");
});

如何使用jQuery添加样式(style)?

使用例子如下:

$("li").filter(".middle").addClass("selected");

css样式内容如下:

<style>
.selected { color:red; }
</style>

支持jQuery的开发工具

jQuery目前也是较为常用的前端开发语言,同时也有许多支持JavaScript的开发工具。如SpreadJS,这是一款企业级的JavaScript电子表格控件,能将电子表格、数据可视化及计算功能集成在JavaScript的Web应用程序中。

程序员Web面试之jQuery的更多相关文章

  1. 程序员Web面试之前端框架等知识

    基于前面2篇博客: 程序员Web面试之jQuery 程序员Web面试之JSON 您已经可以顺利进入Web开发的大门. 但是要动手干,还需要了解一些已有的前端框架.UI套件,即要站在巨人肩膀上而不是从轮 ...

  2. 程序猿Web面试之jQuery

    版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/powertoolsteam/article/details/32325013  又到了一年一度的 ...

  3. 程序员Web面试之JSON

    JSON是什么? JSON(JavaScript对象表示法), 是在网络通信下,常用的一种数据表达格式,它有助于我们于一个自描述的,独立的和轻的方式呈现并交换数据.这些数据可以易于和转换为JavaSc ...

  4. Web面试之JQuery

    程序员Web面试之JQuery   又到了一年一度的毕业季了,青春散场,却等待下一场开幕. 在求职大军中,IT行业的程序员.码农是工科类大学生的热门选择之一, 尤其是近几年Web的如火如荼,更是吸引了 ...

  5. 以技术面试官的经验分享毕业生和初级程序员通过面试的技巧(Java后端方向)

    本来想分享毕业生和初级程序员如何进大公司的经验,但后来一想,人各有志,有程序员或许想进成长型或创业型公司或其它类型的公司,所以就干脆来分享些提升技能和通过面试的技巧,技巧我讲,公司你选,两厢便利. 毕 ...

  6. 好程序员web前端分享前端学习路线自学如何找到工作

    好程序员web前端分享前端学习路线自学如何找到工作,自学能不能学会WEB前端并且找到WEB前端开发岗位的工作取决于自身条件,如果基础好,自律性强那么将会容易很多,还有就是自学最难克服的并不是知识点,而 ...

  7. 好程序员web前端分享HTML基础篇

    好程序员web前端分享HTML基础篇,最近遇到很多新手,都会问,如果要学web前端开发,需要学什么?难不难学啊?多久能入门之类的问题?那么今天好程序员就先来给大家分享一下web前端学习路线:HTML基 ...

  8. 好程序员web前端分享12个CSS高级技巧汇总

    好程序员web前端分享下面这些CSS高级技巧,一般人我可不告诉他哦. 使用 :not() 在菜单上应用/取消应用边框 给body添加行高 所有一切都垂直居中 逗号分隔的列表 使用负的 nth-chil ...

  9. 好程序员web前端分享想要学习前端需要学那些课程

    好程序员web前端分享想要学习前端需要学那些课程,仔细思考了一下如何回答好这个话题,其实前端是一个涵盖面非常之广泛的一个职位,所需知识体系非常庞杂,与传统语言“想要精一行,必先通一门” 有很大差别, ...

随机推荐

  1. 第二十节:详细讲解String和StringBuffer和StringBuilder的使用

    前言 在 Java中的字符串属于对象,那么Java 中提供了 String 类来创建和操作字符串,即是使用对象:因为String类修饰的字符一旦被创建就不可改变,所以当对字符串进行修改的时候,需要使用 ...

  2. 在Markdown中写注释

    概述 下面是我整理的在Markdown中写注释的几种方法,供自己开发时参考,相信对其他人也有用. html标签 既然Markdown内嵌html语法,那么就可以用可以用隐藏的html标签. 注意:需要 ...

  3. php开发中应该注意的错误开关与常见处理[开发篇]

    我们可能一开始就接触一个项目的开发,刚开始时都是信心满满,一定把这个项目做得非常完美,但是时间那么少,任务那么多,我们就只有将就了. 首先,一般情况下,我们会加一个调试标志,define('APP_D ...

  4. Data - 关于大数据

    历史与趋势 大数据的前世今生:诞生.发展.未来? 如何利用数据赚钱?大数据价值变现的10种商业模式及利弊分析 10大行业大数据应用痛点及解决策略 大数据凉了?不,流式计算浪潮才刚刚开始 概念与定义 关 ...

  5. [EXP]CVE-2018-2628 Weblogic GetShell Exploit

    漏洞简介 漏洞威胁:RCE--远程代码执行 漏洞组件:weblogic 影响版本:10.3.6.0.12.1.3.0.12.2.1.2.12.2.1.3 代码: # -*- coding: utf-8 ...

  6. 使用POI导出Excel文件

    创建表头信息 表头信息用于自动生成表头结构及排序 public class ExcelHeader implements Comparable<ExcelHeader>{ /** * ex ...

  7. python面试

    第一部分 python基础篇 1.简述解释型和编译型编程语言? 解释型语言编写的程序不需要编译,在执行的时候,专门有一个解释器能够将VB语言翻译成机器语言,每个语句都是执行的时候才翻译.这样解释型语言 ...

  8. MySQL笔记(7)---事务

    1.前言 前面具体讲了MySQL中的锁实现的方式,解释了是如何保证数据在并发情况下的可靠性,并提到了事务REPETABLE READ和READ COMMITTED,解释了一下这两种事务的不同.本章讲具 ...

  9. 《深入分析Linux内核源代码》读书、私藏笔记大放送

    秉承着"不懂操作系统原理的程序员不是合格的程序员"的至理名言,鄙人又是买陈莉君老师的“Linux教学视频”,又是研读其力作<深入分析Linux内核源代码>,先将总结笔记 ...

  10. 使用 JRebel 进行远程热部署

    JRebel支持热部署,和远程热部署,本文我们来搭建一下远程热部署. 一.服务器安装 JRebel 1.官网下载最新的 JRebel 安装包,下载链接:https://zeroturnaround.c ...