基于js原生和ajax的get和post方法以及jsonp的原生写法的介绍

下面为大家带来一篇基于js原生和ajaxgetpost方法以及jsonp的原生写法实例。内容挺不错的,现在就分享给大家,也给大家做个参考。

login.onclick = function(){var xhr = new XMLHttpRequest();xhr.open("get","http://localhost/ajax2/test2.php?username="+username.value+"&pwd="+pwd2.value,true);xhr.send();xhr.onreadystatechange = function(){if (xhr.readyState == 4) {if (xhr.status>=200 && xhr.status

ajax方法

btn.onclick = function(){ajax(    "GET",    "http://localhost/ajax2/my02.php",    {xingming:xingming.value,pwd:pwd.value},    function(data){console.log(data);},function(errCode){console.log(errCode);})

登录后复制

post方法传参

它与个get方法的区别:

01 安全型。post更安全。

02 速度. get的速度快

03 数量级。 post的数量级更大一些.

具体实现:

var xhr = new XMLHttpRequest();xhr.open("post","http://localhost/ajax2/login2.php",true);var data = {username:username1.value,pwd:pwd1.value}// 设置请求头 告诉服务器发给他的数据是json格式xhr.setRequestHeader("content-type","application/json");xhr.send( JSON.stringify(data) );xhr.onreadystatechange = function(){if (xhr.readyState == 4) {if ( xhr.status >= 200 && xhr.status 

原生jsonp 方法

var sc = document.createElement("script");sc.type = "text/javascript";document.body.appendChild(sc);sc.src = "http://localhost/ajax2/jsonp.php?cb=myCallBack";function myCallBack(data){console.log(data);}

登录后复制

以上就是本文的全部内容,希望对大家的学习有所帮助,更多相关内容请关注PHP中文网!

相关推荐:

Ajax的原生实现关于MIME类型的使用方法

原生JS写Ajax的请求函数功能

ajax回调函数参数传递正确方法

以上就是基于js原生和ajax的get和post方法以及jsonp的原生写法的介绍的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2747462.html

(0)
上一篇 2025年3月8日 04:22:15
下一篇 2025年2月28日 10:44:22

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • jQuery的ajax下载blob文件的方法

    这篇文章主要介绍了jquery的ajax下载blob文件的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下 乍一听有点蒙,之前用ng和react时也写过类似的功能,但是很顺利(所以忘记具体细节了)。jquery为啥会不行呢?看了一…

    编程技术 2025年3月8日
    200
  • jQuery实现的AJAX简单弹出层效果

    这篇文章主要介绍了jquery实现的ajax简单弹出层效果代码,涉及jquery响应鼠标事件动态操作页面元素实现弹出层效果的相关技巧,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了jQuery实现的AJAX简单弹出层效果。分享给…

    2025年3月8日
    200
  • $.ajax()方法进行网页间传值

    这篇文章主要介绍了$.ajax()方法进行网页间传值的具体实现,需要的朋友可以参考下 ajaxtext1.jsp       function fun(){ var ss; var radio1=document.getElementsBy…

    编程技术 2025年3月8日
    200
  • 原生JS+Canvas实现五子棋游戏的代码

    这篇文章主要为大家详细介绍了原生js+canvas实现五子棋游戏,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 本文实例为大家分享了JS  Canvas实现五子棋游戏的具体代码,供大家参考,具体内容如下 nbsp;html>   …

    编程技术 2025年3月8日
    200
  • 使用JavaScript根据图片获取条形码的方法

    本文重点给大家介绍javascript识别图片中的条形码,代码简单易懂,非常不错,具有参考借鉴价值,需要的的朋友参考下吧 最近在弄一个零售超市的项目,但是苦于需要自己录入数据,超市少的也有1000多种商品,自己一个一个录入肯定不太现实,所以…

    2025年3月8日
    200
  • JS实现的JSON序列化操作

    这篇文章主要介绍了js实现的json序列化操作,结合简单实例形式分析了json序列化操作相关实现方法与相关注意事项,代码备有较为详尽的注释便于理解,需要的朋友可以参考下 本文实例讲述了JS实现的JSON序列化操作。分享给大家供大家参考,具体…

    2025年3月8日
    200
  • JS实现点击按钮可实现编辑功能的方法

    本文通过一段实例代码给大家介绍了基于js实现点击按钮可编辑效果,代码简单易懂,非常不错,具有一定的参考借鉴价值,需要的的朋友参考下吧 具体代码如下所示: //修改密码//抓取到的数据function edit() {document.get…

    编程技术 2025年3月8日
    200
  • js惰性函数思想介绍

    惰性函数是js函数式编程的另一个应用,惰性函数表示函数执行的分支只会在函数第一次调用的时候执行,本文就来为大家介绍一下js惰性函数思想,希望对大家有一定的帮助。 在vue、react等框架大量应用之前,我们需要使用jQuery或者原生js来…

    2025年3月8日
    200
  • JS实现显示当前日期的方法

    本文通过实例代码给大家介绍了js实现显示当前日期功能,代码简单易懂,非常不错,具有一定的参考借鉴价值,需要的朋友参考下吧 写在前面:   在做项目中,经常会用到显示当前日期这个功能,在此,记录下来,方便日后查阅。 先给大家展示下效果图:  …

    2025年3月8日
    200
  • js实现各浏览器全屏代码

    本篇文章给大家分享了js实现各浏览器全屏的详细代码,有兴趣的朋友可以参考学习下。 现代浏览器包括ie11,可以直接用h5的全屏api实现 低版本的IE需要通过ActiveX插件实现; //直接上代码 nbsp;html>       …

    编程技术 2025年3月8日
    200

发表回复

登录后才能评论