Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

What are the parsing modes of ajax?

2025-04-02 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/03 Report--

ajax的解析模式有哪些呢,针对这个问题,这篇文章详细介绍了相对应的分析和解答,希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。

一、Ajax中的JSON格式

html代码:

var btn = document.getElementById("btn"); btn.onclick = function(){ var xhr = getXhr(); xhr.open("post","10.php"); xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); /* * 在客户端如何构建JSON格式 * * 构建符合JSON格式的字符串 */ var user = '{"name":"zhangwuji","pwd":"123456"}'; xhr.send("user="+user); xhr.onreadystatechange = function(){ if(xhr.readyState==4&&xhr.status==200){ var data = xhr.responseText; /* * 使用eval()函数进行转换 * * 使用"()"将其包裹,eval()函数强制将其转换为JSON格式(javascript代码) * * 不使用"()"将其包裹,eval()函数将其识别为一个空的代码块 */ var json = eval("("+data+")"); console.log(json); } } } function getXhr(){ var xhr = null; if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else{ xhr = new ActiveXObject("Microsoft.XMLHttp"); } return xhr; }

PHP代码:

二 Ajax中的XML格式

html页面:

var btn = document.getElementById("btn"); btn.onclick = function(){ // 实现Ajax的异步交互 var xhr = getXhr(); xhr.open("post","07.php"); xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); /* * 如何构建符合XML格式的请求数据 * * 注意 * * 请求数据的格式 - key=value 不能改变的 * * 将value值构建成符合XML格式的数据 * * 数据类型 - 字符串(string) * * 格式符合XML的语法要求 * * 编写注意 * * 定义变量 - 专门构建XML格式的数据 * * 在send()方法进行拼串 */ var user = "zhangwuji123456"; xhr.send("user="+user); xhr.onreadystatechange = function(){ if(xhr.readyState==4&&xhr.status==200){ // 接收服务器端的响应数据 var xmlDoc = xhr.responseXML; var nameEle = xmlDoc.getElementsByTagName("name")[0]; var txtEle = nameEle.childNodes[0]; console.log(txtEle.nodeValue); } } } function getXhr(){ var xhr = null; if(window.XMLHttpRequest){ xhr = new XMLHttpRequest(); }else{ xhr = new ActiveXObject("Microsoft.XMLHttp"); } return xhr; }

PHP页面代码:

三 Ajax中的HTML格式

HTML页面:

请选择 山东省 辽宁省 吉林省 请选择 /* * 需要思考哪些事情? * * 在什么时候执行Ajax的异步请求? * * 当用户选择具体的省份信息时 */ // 1. 为id为province元素绑定onchange事件 var provinceEle = document.getElementById("province"); provinceEle.onchange = function(){ // 清空 var city = document.getElementById("city"); var opts = city.getElementsByTagName("option"); for(var z=opts.length-1;z>0;z--){ city.removeChild(opts[z]); } if(provinceEle.value != "请选择"){ // 2. 执行Ajax异步请求 var xhr = getXhr(); xhr.open("post","06.php"); xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); xhr.send("provcince="+provinceEle.value); xhr.onreadystatechange = function(){ if(xhr.readyState==4&&xhr.status==200){ // 接收服务器端的数据内容 var data = xhr.responseText; // data是字符串,转换为数组 var cities = data.split(","); for(var i=0;i

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report