开发移动 Web Ajax 应用

核心提示： 另外，这是非常简单的 Ajax 代码，开发移动 Web Ajax 应用(8)，我们不需要担心 Internet Explorer 不支持，所以我们可以直接创建一个 XMLHttpRequest，对于来自源的每一个记录执行 addEntry 函数， 这个函数为每一个记录创建 UI 元素，我们可以设

另外，这是非常简单的 Ajax 代码。我们不需要担心 Internet Explorer 不支持，所以我们可以直接创建一个 XMLHttpRequest。我们可以设置它的 onreadystatechange 属性为一个函数，在本例中将创建一个闭包。当响应从服务器返回（readyState = 4）且处理过程没有发生问题（status = 200 OK）时，我们就使用 JSON.parse 函数来解析 JSON 响应。对于来自源的每一个记录执行 addEntry 函数。 这个函数为每一个记录创建 UI 元素。如清单 7 所示。

清单 7. addEntry 函数

function　addEntry(e,　prepend){　
　　var　eDiv　=　document.createElement("div");　
　　eDiv.setAttribute("class",　"item");　
　　var　link　=　document.createElement("a");　
　　link.setAttribute("href",　e["link"]);　
　　var　title　=　document.createTextNode(e["title"]);　
　　link.appendChild(title);　
　　eDiv.appendChild(link);　
　　var　button　=　document.createElement("input");　
　　button.setAttribute("type",　"button");　
　　button.setAttribute("value",　"Show");　
　　button.setAttribute("id",　"button"　+　e["id"]);　
　　button.setAttribute("onclick",　"showDescription('"　+　e["id"]　+　"')");　
　　eDiv.appendChild(button);　
　　var　dDiv　=　document.createElement("div");　
　　dDiv.setAttribute("id",　e["id"]);　
　　dDiv.setAttribute("class",　"description");　
　　dDiv.setAttribute("style",　"display:none");　
　　dDiv.innerHTML　=　e["description"];　
　　eDiv.appendChild(dDiv);　
　　var　body　=　document.getElementsByTagName("body")[0];　
　　if　(!prepend　&&　body.childNodes.length　>　1){　
　　　　　　body.appendChild(eDiv);　
　　}　else　{　
　　　　　　body.insertBefore(eDiv,　body.childNodes.item(2));　
　　}　
}