zoukankan      html  css  js  c++  java
  • JQuery面试题2

    1. 在公司是怎么用jquery的?
    基本选择器:1 基本选择器。
    #id:id选择器。
    .class:类选择器.
    标签选择器:根据指定的元素名匹配元素。
    群主选择器:将每一个匹配的元素合并并返回,以分号隔开。
    *:通配符选择器,匹配所有的元素。
    2 层次选择器
    空格:选取指定元素的后代元素。
    >:选取指定下的所有子元素。
    +:选取紧接着的兄弟元素。
    ~:选取元素后的所有兄弟元素。
    3 滤选择器:基本过滤选择器,内容过滤选择器,可见性选择器,属性选择器,子元素选择器等。
    动画效果:在登陆页面时使用过fadeIn()和fadeOut()方法修改元素的不透明度。
    hide和show:同时修改多个样式属性即高度,宽度和不透明度。
    fadeIn()与fadeOut():只改变不透明度。
    slideUp()和slideDown():只改变高度。
    fadeTo():用来代替fadeIn()与fadeOut()方法,只改变不透明度。
    toggle():用来代替hide()和show()方法,所以会同时修改多个样式属性即高度,宽度和不透明度。
    slideToggle():用来代替slideUp()和slideDown()方法,所以只改变高度。
    animate():属于自定义动画的方法,可以代替其他任何动画。
    stop():停止动画。
    合成事件:使用过鼠标悬停事件,到鼠标移至某个地方时就触发指定功能。
    bind():为匹配的元素绑定一个事件处理器。
    hover:模拟光标悬停事件,当光标移动到元素上是就触发第一个函数,相反就触发第二个函数。
    toggle:模拟鼠标连续点击事件,第一次点击调用第一个方法,第二次单击调用第二个方法,依次类推,
    直到调到最后一个,随后轮番调用。
    unbind():移除事件。
    one():在执行完一次以后,处理函数立即被删除。

    2. 为什么要使用jquery?
    因为jQuery是轻量级的框架,大小不到30kb,它有强大的选择器,出色的DOM操作的封装,有可靠的事件处理机制,
    完善的ajax,出色的浏览器的兼容性,而且支持链式操作,隐式迭代,行为层和结构层的分离,还支持丰富的插件,
    jquery的文档也非常的丰富。

    3. 你觉得jquery有哪些好处?
    轻量级的框架,强大的选择器,出色的DOM封装,可靠的事件处理机制,完善的Ajax,出色的浏览器兼容,支持链式操作,隐式迭代,
    行为层与结构层分离,丰富的插件机制,文档完善且开源的。

    4. 使用jquery遇到过哪些问题,你是怎么解决的?
    1. 前台拿不到值,是JSON可能会出现的错误(一般是多了一个空格等),这编译是不会报错的。
    2. 类库冲突:使用jQuery.noConflict()方法将$控制权渡让给第一个实现它的那个库。
    1. 使用jQuery替代$进行渡让。
    2. 使用$以传递参数的形式进行渡让。
    3. 使用返回值进行渡让。
    4. 使用匿名函数进行渡让。
    3. 以前在处理一个数据问题时,发现jQuery.ajax()方法返回的值一直有问题,清除缓存后数据无误,多次测试后发现返回的值都是之前的值,
    并且一直未执行url(后台为JAVA,设置断点一直未进入)。
    后来在网上查找原因发现是未设置type,如果没设置jQuery.ajax的type="Post",那么ajax就会默认type="Get",这就会导致之前数据被缓存起来。加上type="Post",问题解决!

    5. 你知道jquery中的选择器吗,请讲一下有哪些选择器?
    jQuery中的选择器大致分为:基本选择器,层次选择器,过滤选择器,表单选择器。
    1. 基本选择器。
    #id:id选择器。
    .class:类选择器.
    标签选择器:根据指定的元素名匹配元素。
    群主选择器:将每一个匹配的元素合并并返回,以分号隔开。
    *:通配符选择器,匹配所有的元素。
    2. 层次选择器
    空格:选取指定元素的后代元素。
    >:选取指定下的所有子元素。
    +:选取紧接着的兄弟元素。
    ~:选取元素后的所有兄弟元素。
    3. 过滤选择器
    1 基本过滤选择器
    :first():选取第一个元素
    :last():选取最后一个元素
    :not(selector):除去所有给定选择器所匹配的元素
    :even():选取索引为偶数的的所有元素(索引从0 开始)
    :odd:选取索引为奇数的的所有元素(索引从0 开始)
    :eq(index):选取索引=index的元素(索引从0 开始)
    :gt(index):选取索引>index的元素(索引从0 开始)
    :lt(index):选取索引<index的元素(索引从0 开始)
    :header():选取所有标题
    :animated():选取当前正在执行动画的所有元素
    2 内容过滤选择器
    :contains()(text):选取含有文本内容为"text"的元素。
    :empty():选取不包含子元素或文本的空元素
    :has()(selectcr):选取含有选择器所匹配的元素的元素。
    :parent():选取含有子元素或包含文本的元素。
    3 可见性选择器
    :hidden():选取所有不可见元素。
    :visible():选取所有可见元素
    4 属性选择器
    [attribut]:选取拥有此属性的元素。
    [attribut =value]:选取属性值为value的元素。
    [attribut!=value]:选取属性值不等于value的元素。
    [attribut ^=value]:选取属性值以value开始的元素。
    [attribut $=value]:选取属性值以value结束的元素。
    [attribut *=value]:选取属性值含有value的元素。
    [selector1][selector2][selector3]:用属性选择器合并成一个复合属性选择器,满足多个条件,每选择一次,缩小一次范围。
    5 子元素选择器
    :nth(安丝)-child(index/even/odd/epuation):选取每个父元素下的第index个子元素或奇偶元素(index从一算起)。
    :first-child:选取每个父元素的第一个子元素
    :last-child:选取每个父元素的最后一个子元素
    :only-child:如果某个元素是它父元素中唯一的子元素,那么将会被匹配。如果父元素中含有其它元素,则不会被匹配。
    4. 表单对象属性选择器
    :enabled():选取所有可用元素。
    :disabled():选取所有不可用的元素
    :checked():选取所有被选中的元素(单选框,复选框)。
    :selected():选取所有被选中的选项元素(下拉框)。

    6. jquery中的选择器 和 css中的选择器有区别吗?
    jQuery选择器支持CSS里的选择器。
    jQuery选择器可用来添加样式和添加相应的行为。
    CSS 中的选择器是只能添加相应的样式。

    7. 你觉得jquery中的选择器有什么优势?
    简单的写法 $('ID') 来代替 document.getElementById()函数。
    支持CSS1 到CSS3 选择器。
    完善的处理机制(就算写错了id也不会报错)。

    8. 你在使用选择器的时候有有没有什么觉得要注意的地方?
    1 选择器中含有".","#","[" 等特殊字符的时候需要进行转译。
    2 属性选择器的引号问题。
    3 选择器中含有空格的注意事项。

    9. jquery对象和dom对象是怎样转换的?
    jquery转DOM:jQuery 对象是一个数组对象,可以通过[index]得到相应的DOM对象,
    还可以通过get[index]去得到相应的DOM对象。
    DOM转jQuery:$(DOM对象)。

    10. 你是如何使用jquery中的ajax的?
    如果是一些常规的ajax程序的话,使用load(),$.get(),$.post(),一般使用的是$.post() 方法。
    如果需要设定beforeSend(提交前回调函数),error(失败后处理),success(成功后处理)及complete(请求完成后处理)回调函数等,
    一般使用的是$.ajax()。

    11. 你觉得jquery中的ajax好用吗,为什么?
    好用的。
    因为jQuery提供了一些日常开发中ajax的快捷操作,例 load,ajax,get,post等等,所以使用jQuery开发ajax将变得极其简单,
    我们就可以集中精力在业务和用户的体验上,不需要去理会那些繁琐的XMLHttpRequest对象。

    12. jquery中$.get()提交和$.post()提交有区别吗?
    1 $.get() 方法使用GET方法来进行异步请求的。
    $.post() 方法使用POST方法来进行异步请求的。
    2 get请求会将参数跟在URL后进行传递,
    而POST请求则是作为HTTP消息的实体内容发送给Web服务器的,这种传递是对用户不可见的。
    3 get方式传输的数据大小不能超过2KB,
    而POST要大的多。
    4 GET 方式请求的数据会被浏览器缓存起来,因此有安全问题。

    13. jquery中的load方法一般怎么用的?
    load方法一般在载入远程HTML代码并插入到DOM中的时候用,通常用来从Web服务器上获取静态的数据文件。
    如果要传递参数的话,可以使用$.get() 或 $.post()。

    14. 在jquery中你是如何去操作样式的?
    attr()获取或设置样式。
    addClass() 来追加样式。
    removeClass() 来删除样式。
    toggle() 来切换样式。
    hasClass(汉丝) 判断样式。

    15. 简单的讲叙一下jquery是怎么处理事件的,你用过哪些事件?
    通过jquery的事件处理过匹配的元素绑定事件,如hover(耗为儿)鼠标连续点击事件,toggle(托狗儿)光标悬停事件。
    首先去装载文档,在页面家在完毕后,浏览器会通过javascript 为DOM元素添加事件。

    16. 你使用过jquery中的动画吗,是怎样用的?
    hide() 和 show() 同时修改多个样式属性。像高度,宽度,不透明度。
    fadeIn() 和fadeOut() fadeTo() 只改变不透明度。
    slideUp() 和 slideDown() slideToggle() 只改变高度。
    animate() 属于自定义动画的方法。

    17. 你使用过jquery中的插件吗?

    答:看个人的实力和经验来回答了。一般是用校验这块比较多

    18. 你一般用什么去提交数据,为什么?
    答:一般我会使用的是$.post() 方法。
    如果需要设定beforeSend(提交前回调函数),error(失败后处理),success(成功后处理)
    及complete(请求完成后处理)回调函数等,这个时候我会使用$.ajax()

    19. 在jquery中引入css有几种方式?
    四种 行内式,内嵌式,导入式,链接式。

    20. 你在jquery中使用过哪些插入节点的方法,它们的区别是什么?
    答:append(),appendTo(),prepend(),prependTo(),after(),insertAfter()
    before(),insertBefore() 
    大致可以分为 内部追加和外部追加
    append() 表式向每个元素内部追加内容。
    appendTo() 表示 讲所有的元素追加到指定的元素中。
    例$(A)appendTo(B) 是将A追加到B中
    下面的方法解释类似

    21. 你使用过包裹节点的方法吗,包裹节点有方法有什么好处?
    答: wrapAll(),wrap(), wrapInner()
    需要在文档中插入额外的结构化标记的时候可以使用这些包裹的方法
    应为它不会帛画原始文档的语义

    22. jquery中如何来获取或和设置属性?
    jQuery中可以用attr()方法来获取和设置元素属性
    removeAttr() 方法来删除元素属性

    23. 如何来设置和获取HTML 和文本的值?
    答:html()方法 类似于innerHTML属性 可以用来读取或者设置某个元素中的HTML内容
    注意:html() 可以用于xhtml文档 不能用于xml文档
    text() 类似于innerText属性 可以用来读取或设置某个元素中文本内容。
    val() 可以用来设置和获取元素的值

    24. 你jquery中有哪些方法可以遍历节点?
    答 :children() 取得匹配元素的子元素集合,只考虑子元素不考虑后代元素
    next() 取得匹配元素后面紧邻的同辈元素
    prev() 取得匹配元素前面紧邻的同辈元素
    siblings() 取得匹配元素前后的所有同辈元素
    closest() 取得最近的匹配元素
    find() 取得匹配元素中的元素集合 包括子代和后代

    25. 子元素选择器 和后代选择器元素有什么区别?
    答:子代元素是找子节点下的所有元素,后代元素是找子节点或子节点的子节点中的元素

    26. 在jquery中可以替换节点吗?
    答:可以 在jQuery中有两者替换节点的方式
    replaceWith() 和 replaceAll()
    例如在<p title="hao are you">hao are you</p>替换成
    <strong>I am fine<strong>
    $('p').replaceWith('<strong>I am fine</strong>');
    replaceAll 与replaceWith的用法前后调换一下即可。

    27. 你觉得beforeSend方法有什么用?
    答:发送请求前可以修改XMLHttpRequest对象的函数,在beforeSend中
    如果返回false 可以取消本次的Ajax请求。XMLHttpRequest对象是唯一的参数
    所以在这个方法里可以做验证

    28. siblings() 方法 和 $('prev~div')选择器是一样的嘛?
    答: $('prev~div') 只能选择'#prev'元素后面的同辈<div>元素
    而siblings()方法与前后的文职无关,只要是同辈节点就都能匹配。

    29. 你在ajax中使用过JSON吗,你是如何用的?
    答:使用过,在$.getJSON() 方法的时候就是。
    因为 $.getJSON() 就是用于加载JSON文件的

    30. 有哪些查询节点的选择器?
    答:我在公司使用过 :first 查询第一个,:last 查询最后一个,:odd查询奇数但是索引从0开始
    :even 查询偶数,:eq(index)查询相等的 ,:gt(index)查询大于index的 ,:lt查询小于index
    :header 选取所有的标题等

    31. nextAll() 能 替代$('prev~siblindgs')选择器吗?
    答:能。 使用nextAll() 和使用$('prev~siblindgs') 是一样的

    32. jQuery中有几种方法可以来设置和获取 样式
    答 :addClass() 方法,attr() 方法

    33. $(document).ready()方法和window.onload有什么区别?
    答: 两个方法有相似的功能,但是在实行时机方面是有区别的。
    1 window.onload方法是在网页中所有的元素(包括元素的所有关联文件)完全
    加载到浏览器后才执行的。
    2 $(document).ready() 方法可以在DOM载入就绪时就对其进行操纵,并调用
    执行绑定的函数。

    34. jQuery是如何处理缓存的?
    答 :要处理缓存就是禁用缓存.
    1 通过$.post() 方法来获取数据,那么默认就是禁用缓存的。
    2 通过$.get()方法 来获取数据,可以通过设置时间戳来避免缓存。
    可以在URL后面加上+(+new Date)
    例 $.get('ajax.xml?'+(+new Date),function () {
    //内容
    });
    3 通过$.ajax 方法来获取数据,只要设置cache:false即可。

    35. $.getScript()方法 和 $.getJson() 方法有什么区别?
    答: 1 $.getScript() 方法可以直接加载.js文件,并且不需要对javascript文件进行处理
    ,javascript文件会自动执行。
    2 $.getJson() 是用于加载JSON 文件的 ,用法和$.getScript()

    36. 你读过有关于jQuery的书吗?
    《jquery基础教程》 《jquery实战》 《锋利的jquery》 《巧用jquery》 《jQuery用户界面库学习指南》等

    37. $("#msg").text(); 和 $("#msg").text("<b>new content</b>");有什么区别?
    答:1 $("#msg").text() 是 返回id为msg的元素节点的文本内容
    2 $("#msg").text("<b>new content</b>"); 是 将“<b>new content</b>” 作为普通文本串写入id为msg的元素节点内容中,
    页面显示粗体的<b>new content</b>

    38. radio单选组的第二个元素为当前选中值,该怎么去取?
    答 : $('input[name=items]').get(1).checked = true;

    39. 选择器中 id,class有什么区别?
    答:在网页中 每个id名称只能用一次,class可以允许重复使用

    40. 你使用过哪些数据格式,它们各有什么特点?
    答: HTML格式 ,JSON格式,javascript格式,XML格式
    1 HTML片段提供外部数据一般来说是最简单的。
    2 如果数据需要重用,而且其他应用程序也可能一次受到影响,那么在性能和文件大小方面具有优势的JSON通常是不错的选择。
    3 而当远程应用程序未知时,XML则能够为良好的互操作性提供最可靠的保证。

    41. jQuery 能做什么?
    答:1 获取页面的元素 
    2 修改页面的外观
    3 改变页面大的内容
    4 响应用户的页面操作
    5 为页面添加动态效果
    6 无需刷新页面,即可以从服务器获取信息
    7 简化常见的javascript任务

    42. 在ajax中data主要有几种方式?
    答 : 三种,html拼接的,json数组,form表单经serialize()序列化的。

    43. jQuery中的hover()和toggle()有什么区别?
    答 hover()和toggle()都是jQuery中两个合成事件。
    hover()方法用于模拟光标悬停事件。
    toggle()方法是连续点击事件。

    44. 你知道jQuery中的事件冒泡吗,它是怎么执行的,何如来停止冒泡事件?
    答 : 知道,
    事件冒泡是从里面的往外面开始触发。
    在jQuery中提供了stopPropagation()方法可以停止冒泡。

    45. 例如 单击超链接后会自动跳转,单击"提交"按钮后表单会提交等,有时候我想阻止这些默认的行为,该怎么办?
    答: 可以用 event.preventDefault()
    或 在事件处理函数中返回false,即 return false;

    46. jquery表单提交前有几种校验方法?分别为??
    formData:返回一个数组,可以通过循环调用来校验
    jaForm:返回一个jQuery对象,所有需要先转换成dom对象
    fieldValue:返回一个数组
    beforeSend()

    47. 在jquery中你有没有编写过插件,插件有什么好处?你编写过那些插件?它应该注意那些?
    答: 插件的好处:对已有的一系列方法或函数的封装,以便在其他地方重新利用,方便后期维护和提高开发效率
    插件的分类:封装对象方法插件 、封装全局函数插件、选择器插件
    注意的地方:
    1.插件的文件名推荐命名为jquery.[插件名].js,以免和其他的javaScript库插件混淆
    2.所有的对象方法都应当附加到jQuery.fn对象上,而所有的全局函数都应当附加到jQuery对象本身上
    3.插件应该返回一个jQuery对象,以保证插件的可链式操作
    4.避免在插件内部使用$作为jQuery对象的别名,而应使用完整的jQuery来表示,这样可以避免冲突或使用闭包来避免
    5.所有的方法或函数插件,都应当一分好结尾,否则压缩的时候可能出现问题。在插件头部加上分号,这样可以避免他人的不规范代码给插件带来影响
    6.在插件中通过$.extent({})封装全局函数,选择器插件,扩展已有的object对象
    通过$.fn.extend({})封装对象方法插件

    48. 怎样给jquery动态附加新的元素?那么怎样给新生成的元素绑定事件呢?
    jQuery的html()可以给现在元素附加新的元素
    直接在元素还未生成前就绑定肯定是无效的,因为所绑定的元素目前根本不存在。
    所以我们可以通过live和livequery来动态绑定事件

  • 相关阅读:
    yii2 gii 命令行自动生成控制器和模型
    控制器中的方法命名规范
    Vue Property or method "" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based
    IDEA插件:GsonFormat
    Spring Boot : Access denied for user ''@'localhost' (using password: NO)
    Typora添加主题
    Git基础命令图解
    Java Joda-Time 处理时间工具类(JDK1.7以上)
    Java日期工具类(基于JDK1.7版本)
    Oracle SQL Developer 连接Oracle出现【 状态: 失败 -测试失败: ORA-01017: invalid username/password; logon denied】
  • 原文地址:https://www.cnblogs.com/t0404/p/10291005.html
Copyright © 2011-2022 走看看