第六章 ajax

Posted 2020-09-21 wanna-be-ok

　　ajax应用程序通常只不过是一个针对html的代码块请求。这种被称作AHAH（asynchronous HTTP and HTML，异步HTTP和HTML）的技术，通过jQuery来实现。

　　所有的Ajax请求在默认情况下都是异步的。

　　对于必须要延迟到加载完成才能继续的操作，jQuery提供了一个回调函数没通过回调函数可以再某些效果完成之后执行操作。Ajax回调的功能与此类似，只不过是在数据从服务器返回后执行操作。

　　1、追加HTML

　　2、操作javascript

　　取得JSON

　　前面我们曾经看到过，JavaScript对象是有一些“键-值”对组成的，而且还可以方便的使用花括号{}来定义。另一方面，JavaScript的数组则可以使用方括号【】和饮食声明的

逐渐递增的键进行动态定义。将这两种语法组合起来，可以轻松的表达复杂而且庞大的数据结构。

　　Douglas Crockford为了这种简单的语法起了一个名字，叫做JSON（javascript object notation ，javascript对象表示法）。通过这种表示方法能够方便的取代数据量庞大的XML格式：

{
"key":"value",
"key1":[
   "array",
    "of",
    "items"
]
}

　　在对象字面量和数字字面量的基础上，JSON格式的语法具有很强的表达能力，但对其中的值也有一定的限制。例如，JSON规定多有的对象键以及所有的字符串值，都必须包含在双引号中。而且函数也不是有效的JSON值。由于存在这些限制，开发人员最好不手工编辑JSON，而应该用服务器端语言来生成。

　　要取得这些数据，可以使用$.getJSON()方法。这个方法会在取得相应文件后对文件进行处理，会解析这个字符串，并将处理得到的JavaScript对象提供给调用代码。

　　使用全局jQuery函数

　　到目前为止，我们使用的多有jquery方法都需要通过$()函数构建一个jQuery对象进行调用。通过选择符表达式，我们可以指定一组要操作的DOM记额点，然而再用这些jQuery方法以某种方式对他们进行操作。$.getJSON()函数却不一样。从逻辑上说，没有该方法适用的DOM元素；座位结果的对象只能提供给脚本，而不能插入到页面中。为此，gerJSON（）是作为全局jQuery对象（有jQuery库定义的jQuery活$对象）的方法定义的，也就是说，他不是个别jQuery对象实例（即通过$()函数创建的对象）的方法。

　　如果javascript中有类似其他面向对象语言中的类，那我们可以把$.getJSOn()称为类似方法。为了便于理解，我们在这里称其为全局函数；实际上为了不与其他函数名称发生冲突，这些全局函数使用的是jQuery命名空间。

　　$.getJSON()函可以接受第二个参数，这个参数是当家在完成时调用的函数。如上所述，Ajax请求的都是异步的，回调函数提供了一种等待数据返回的方式，而不是立刻执行代码。回调函数也需要一个参数，改参数中保存着返回的数据。

$.getJSON(‘b.json‘,function(data))

可以通过data变量来遍历JSON数据结构了。具体来说 需要迭代顶级数组，为每个项构建相应的HTML代码。虽然可以再这里使用标准的for循环，但是我们需要借此机会介绍jQuery的另一个实用全局函数$.each()。对应方法是.each()。$.each()函数不操作jQuery对象，它以数组或者对象作为第一个参数，以回调函数作为第二个参数。此外，还需要将每次循环中数组或对象的当前索引和当前项座位回调函数的两个参数。

关于加粗位置，需要仔细阅读，数组或对象作为第一参数（data），以回调函数作为第二个参数 function（entryIndex，entry）{}entry是创建div的className//有点不太懂这块。注意下面这段话

　　这里通过$.each()函数一次遍历每个项，使用entry对象的内容构建起HTML代码结构。构建好HTML之后，通过.html（）把他插入到<div>中替换以前的内容。

通过这段话将其理解为。entry是要创建的对象，并且看为数据库输入的对象。

　　尽管JSON格式很简洁，但他却不容许任何错误。包括方括号、花括号、引号和逗号都必须合理且正确的使用，否则文件不会加载。并且在多数浏览器中，当文件加载失败时我们看不到任何错误信息；脚本知识静默的彻底终止运转。

　　3、执行脚本

　　虽然可以在需要时动态的引入<script>标签，但诸如需要代码的更优雅的方式则是通过jQuery直接加载.js文件。

　　向页面中注入脚本与加载HTML片段一样简单。但在这种情况下，需要使用全局函数$.getScript（），这个全局函数与他的同辈函数类似，接受一个URL参数以查找脚本文件。

$.getScript（‘c.js）；

　　以这种方式取得的脚本在当前页面的全局环境下执行。这意味着脚本有权访问在全局环境中定义的函数和变量，当然也包括jQuery自身。

 这里先中断一下，要了解学习一下XML。