也可以用iframe方法发get请求，但是目前iframe基本已经被弃用，所以此处就不介绍这个方法。
方案一：用图片造 get 请求
button.addEventListener(‘click‘, function(e){ ???let image = document.createElement(‘img‘) ???image.src = ‘/pay‘ ???image.onload = function(){ // 状态码是 200~299 则表示成功 ???????alert(‘成功‘) ???} ???image.onerror = function(){ // 状态码大于等于 400 则表示失败 ???????alert(‘失败‘) ???}})方案二：用 script 造 get 请求
- 用script发请求有个问题，不管成功或者失败，都会生成一个<script>并执行其中的内容。
button.addEventListener(‘click‘, function(e){ ???let script = document.createElement(‘script‘) ???script.src = ‘/pay‘ ???document.body.appendChild(script) //一定要.body ???script.onload = function(e){ // 状态码是 200~299 则表示成功 ??????//删除新生成的<script> ??????e.currentTarget.remove() ???} ???script.onerror = function(e){ // 状态码大于等于 400 则表示失败 ???????e.currentTarget.remove() ???}})//后端代码...if (path === ‘/pay‘){ ???let amount = fs.readFileSync(‘./db‘, ‘utf8‘) ???amount -= 1 ???fs.writeFileSync(‘./db‘, amount) ???response.setHeader(‘Content-Type‘, ‘application/javascript‘) ?????//如果是image发请求，上一列最后一个参数‘image/png‘，并且需要write传入一个真的图片才能成功 ???response.write(‘amount.innerText = ‘ + amount)
response.end() } ...方案三：JSONP
button.addEventListener(‘click‘, (e)=>{ ???let script = document.createElement(‘script‘) ???let functionName = ‘dsfnd‘+ parseInt(Math.random()*10000000 ,10) ???window[functionName] = function(){ ?// 每次请求之前搞出一个随机的函数 ???????amount.innerText = amount.innerText - 0 - 1 ???} ???script.src = ‘/pay?callback=‘ + functionName ???document.body.appendChild(script) ???script.onload = function(e){ // 状态码是 200~299 则表示成功 ???????e.currentTarget.remove() ???????delete window[functionName] // 请求完了就kill掉这个随机函数 ???} ???script.onload = function(e){ // 状态码大于等于 400 则表示失败 ???????e.currentTarget.remove() ???????delete window[functionName] // 请求完了就kill掉这个随机函数 ???}})//后端代码...if (path === ‘/pay‘){ ???let amount = fs.readFileSync(‘./db‘, ‘utf8‘) ???amount -= 1 ???fs.writeFileSync(‘./db‘, amount) ???let callbackName = query.callback ???response.setHeader(‘Content-Type‘, ‘application/javascript‘) ???response.write(` ???????${callbackName}.call(undefined, ‘success‘) ???`) ???response.end()}...请求方：aaa.com 的前端程序员（浏览器）响应方：bbb.com 的后端程序员（服务器）假设有aaa.com、bbb.com 两个网站，aaa.com的前端想要访问bbb.com 的后端，aaa.com的前端可在请求的“/pay”前面加上bbb.com 的域名。通过跨域SRG。后端不需要太了解前端的代码，如果太了解，就叫前端后端耦合，需要解耦。解耦的方法：后段调用前端提供的一个函数。什么是JSONP？请求方创建 script，src 指向响应方，同时传一个查询参数 ?callbackName=yyy 响应方根据查询参数callbackName，构造形如 yyy.call(undefined, ‘你要的数据‘) yyy(‘你要的数据‘) 这样的响应 浏览器接收到响应，就会执行 yyy.call(undefined, ‘你要的数据‘) 请求方就知道了他要的数据 这就是 JSONP 。简单说就是script加callback参数。
约定：callbackName -> callback yyy -> 随机数 frank12312312312321325()
方案四：jQuery
$.ajax({ url: "http://jack.com:8002/pay", dataType: "jsonp", success: function( response ) { ????if(response === ‘success‘){ ????amount.innerText = amount.innerText - 1 ????} } }) $.jsonp()JSONP 为什么不支持 POST？
因为JSONP是通过动态创建Script实现的，动态创建Script的时候只能用GET，不能用POST。
实现HTML页面的局部刷新
原文地址：https://www.cnblogs.com/nolaaaaa/p/9152954.html