• HTML5.与JQUERY与AJAX常见面试题


    1. HTML5


    1.1.简要描述 HTML5中的本地存储

    参考答案:


    很多时候我们会存储用户本地信息到电脑上,例如:比方说用户有一个填充了一半的长
    表格,然后突然网络连接断开了,这样用户希望你能存储这些信息到本地,当网络恢复的时
    他想获取这些信息然后发送到服务器进行存储。
    现代浏览器拥有的存储被叫做“Local Storage”,用于存储这些信息。

    1.2.简要描述 HTML5中 Canvas的作用

    参考答案:


    Canvas是 HTML5出现的新标签,拥有自己的属性、方法和事件,其中就有绘图的方
    J ava Sc ri pt 能够调用它在网页上完成绘图。
    Canvas也是 HTML5中最强大的特性之一,允许开发者使用动态和交互式可视化方法
    在 Web上实现桌面应用程序的功能。

    1.3. HTML5有哪些不同类型的存储?

    参考答案:


    HTML5支持本地存储,在之前的版本中是通过 Cookie实现的。 HTML5本地存储速
    度快而安全。
    有两种不同的对象可用来存储数据:
     localStorage:适用于长期存储数据,浏览器关闭后数据不丢失; sessionStorage:存储的数据在浏览器关闭后自动删除。

    1.4.除了音频和视频, HTML5还支持其他什么新的媒体元素?

    参考答案:

    HTML5对媒体支持很强,除了 audio和 video外,还提供:
     <embed>:作为外部应用的容器; <track>:定义媒体的文本跟踪; <source>:多种媒体源的支持。

    1.5. HTM L5应用缓存是什么

    参考答案:
    常用于实现用户的离线浏览。如果网络连接不可用,页面应该来自浏览器缓存,离线应用缓存可以帮助你达到这个目的。
    应用缓存可以帮助你指定哪些文件需要缓存,哪些不需要。

    1.6.什么是 Web Worker?为什么我们需要他们?

    参考答案:


    查看如下代码(模拟会执行上百万次的繁重代码):

    function test( ) {
    for(i=0;i< 10000000000; i++){
    x=x+i;
    }
    }
    如果上述代码在 HTML按钮点击以后执行,这种执行是同步的,即,浏览器必须等到此执行完毕之后才能进行其他操作。因为此操作耗时较长,那么这个操作会导致浏览器冻结并且没有响应,而且屏幕还会出现异常信息。
    如果可以将这些繁重的代码移动到 Javascript文件中,并采用异步的方式运行,就可以解决这个问题。 这就是 web worker的作用。 Web Worker用于异步执行 JavaScript文件,提高浏览器的敏捷度。

    1.7. HTM L5应用程序缓存和浏览器缓存有什么区别

    参考答案:
    应用程序缓存是 HTM L5的重要特性之一,提供了离线使用功能,让应用程序可以获取本地的网站内容,例如 HTML、 CSS、图片以及 Javascript。这个特性可以提高网站性能,它的实现借助于 manifest文件,代码如下:

    <!doctype html>
    <html manifest="example. appcache"> ....
    JQU E RY而3

    </html>

    与传统浏览器缓存相比,它不强制用户访问的网站内容被缓存。

    1.8.简要描述 HTML5中新增的表单元素

    参考答案:


    datalist,datetime, output, date, month,week,time,color, number, range,
    email, url, search等。

    2.jquery


    2.1. body中的 onload()函数和 jQuery中的$(document).ready()有什么区别

    参考答案:


    onload()和 document.ready()的区别如下:
     可以在页面中使用多个document.ready(),但只能使用一次onload(); document.ready()函数在页面 DOM元素加载完成以后就会被调用,
    onload()函数则要在所有的关联资源(包括图像,音频)加载完毕才会调用。

    2.2. jQue ry中有哪几种类型的选择器

    参考答案:


    有3种类型的选择器,如下:


     基本选择器:直接根据 id, css类名,元素名返回 dom元素;
     层次选择器:也叫做路径选择器,可以根据路径层次来选择相应的dom元素;
    过滤选择器:在前面的基础上过滤相关条件,得到匹配的 dom元素。

    2.3.jQuery的美元符号$有什么作用?

    参考答案:


    美元符号$是'jQuery'的别名,它是jQuery选择器,查看如下代码:

    $ (document) .ready(function( ) { } ) ;

    4

    也可以用 jQue ry来替代

    jQuery(document) .ready(function( ) { }) ;


    2.4.jQuery中的 Delegate()函数有什么作用?

    参考答案:


    delegate()会在以下两个情况下使用到:


     当需要给父元素其下的子元素添加事件时,代码如下:

    Html代码
    $ ("ul") .delegate("li", "click", function() { $ (this) .hide() ;
    });

     当元素在当前页面中不可用时,可以使用 delegate()

    3. AJAX


    3.1.请写出至少5种常见的 http状态码以及代表的意义

    参考答案:


    5种常见的 http状态码以及代表的意义如下:


     200( OK):请求已成功,请求所希望的响应头或数据体将随此响应返回。
     303( See Other):告知客户端使用另一个 URL来获取资源。
     400( Bad Request):请求格式错误。1)语义有误,当前请求无法被服务器
    理解。除非进行修改,否则客户端不应该重复提交这个请求;2)请求参数有误。 404( Not Found):请求失败,请求所希望得到的资源未被在服务器上发现。 500( Internal Server Error):服务器遇到了一个未曾预料的状况,导致了它
    无法完成对请求的处理。

    3.2.简要描述你对 AJAX的理解

    参考答案:
    AJAX的全称是“Asynchronous JavaScript and XML”,即异步的 JavaScript和XM L。 它是指一种创建交互式网页应用的网页开发技术,可以实现页面的异步请求和局部刷新。

    5


    AJAX包含下列技术:


     基于 web标准 XHTML+CSS的表示
     使用 DOM( Document ObjectModel)进行动态显示及交互 使用 XML和 XSLT进行数据交换及相关操作
     使用 XMLHttpRequest进行异步数据查询、检索

    3.3.请介绍一下 XMLHttprequest对象

    参考答案:


    AJAX的核心是 JavaScript对象XmlHttpRequest。 该对象在 Internet Explorer5中
    首次引入,它是一种支持异步请求的技术。简而言之,Xml HttpRequest可以使用 JavaScript
    向服务器提出请求并处理响应,而不阻塞用户。通过 XMLHttpRequest对象, Web开发
    人员可以在页面加载以后进行页面的局部更新。

    3.4. AJAX应用和传统 Web应用有什么不同

    参考答案:


    在传统的 Javascript编程中,如果想得到服务器端数据库或文件上的信息,或者发送
    客户端信息到服务器,需要建立一个 HTM L form然后 GET或者 POST数据到服务器端。
    用户需要点击“Submit”按钮来发送或者接受数据信息,然后等待服务器响应请求,页面
    重新加载。因为服务器每次都会返回一个新的页面, 所以传统的 web应用有可能很慢而且
    用户交互较差。
    使用 AJAX技术, 就可以使 Javascript通过 XMLHttpRequest对象直接与服务器进
    行交互。通过 HTTP Request, 一个web页面可以发送一个请求到 web服务器并且接受
    web服务器返回的信息(不用重新加载页面),展示给用户的还是同一个页面,但是只实现页
    面的局部刷新,从而提高体验度。

    3.5.介绍一下 XM LHttpRequest对象的常用方法和属性

    参考答案:


     open(“method”,” URL”) :建立对服务器的调用,第一个参数是 HTTP
    请求方式(可以为 GET, POST或任何服务器所支持的您想调用的方式), 第
    二个参数是请求页面的 URL;
     send()方法:发送具体请求;
     abort()方法:停止当前请求;
     readyState属性:请求的状态,有5个可取值( 0=未初始化,1=正在加载,
    },error: function( ) {window.alert( "系统错误" ) ;}6
    2=以加载,3=交互中,4=完成);
     responseText属性:服务器的响应,表示为一个串; reponseXML属性:服务器的响应,表示为XML; status属性:服务器的 HTTP状态码。

    3.6.简述 AJAX的交互模型,以及同步和异步的区别

    参考答案:
    AJAX主要用于实现从服务器获取数据并局部刷新页面。其交互模型为, AJAX在浏览器端引入一个执行引擎,它一边接收 user的请求,一边传送数据给服务器,并把服务器端返回的结果展现给 u se r。
    同步:脚本会停留并等待服务器发送回复然后继续。
    异步:脚本不停留并处理可能的回复。

    3.7.现需要使用 jQuery代码实现 ajax请求,详细信息如下:

    请求的 url : carinfo.do
    发送方式: post
    发送数据: id为 s1的文本框的值
    返回数据: json格式
    请求成功:将返回数据写入id为 s2的文本框中请求失败:弹出文本“系统错误”
    请提供代码实现上述功能。


    参考答案:

    $.ajax({
    url: "carinfo. do",
    type: "post" ,
    data:$ ("#s1") .val() ,
    dataType: "j son" ,
    success:function(resText) {
    $ ("#s2") .val(resText) ;
    });


    3.8. AJAX都有哪些优点和缺点

    参考答案:
    优点:


     页面局部刷新,提高用户体验度;
     使用异步方式与服务器通信,具有更加迅速的响应能力;
     减轻服务器负担;
     基于标准化的并被广泛支持的技术,不需要下载插件或者小程序。


    缺点:


     不支持浏览器 back按钮;
     安全问题;

    谢舒心,转载请表明出处
  • 相关阅读:
    RocketMQ 负载均衡
    RocketMQ 介绍及核心概念
    PagView动画
    andriod 视频播放方案
    Andriod 插件化初识
    Android 加载库的方式
    AIDL服务死亡代理
    Android O 创建后台Service
    IntentService
    Activity Dialog 进出动画
  • 原文地址:https://www.cnblogs.com/xieshuxin/p/6710481.html
Copyright © 2020-2023  润新知