html怎么写post请求?实现方法有哪几种方法?

2021-06-16 11:10:18 浏览数 (7833)

在我们的学习中前端是一门比较容易入门的语言,当然入门容易并不是说很简单,前端语言在越往后学的就需要越多我们掌握的就需更多的精力放在上面,那么在前端中“html怎么写post请求?有哪几种方法?”这个问题中,小编为大家整理的一些相关的资料。


1.为什么要用post请求?

因为在我们使用​post​请求的时候用户在涉及有关于密码和隐私的内容时,不会在地址栏上面看到我们的内容起到了保护作用,所以这就是为什么要使用​post​请求的原因。


2.方法一:

我们通过使用传统的方式来对浏览器进行​post​请求,代码如下:

var postData = {
    "name1": "value1",
    "name2": "value2"};
postData = (function(obj){ // 转成post需要的字符串.
    var str = "";
    for(var prop in obj){
        str += prop + "=" + obj[prop] + "&"
    }
    return str;
})(postData);
var xhr = new XMLHttpRequest();
xhr.open("POST", "../module", true);
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xhr.onreadystatechange = function(){
    var XMLHttpReq = xhr;
    if (XMLHttpReq.readyState == 4&&XMLHttpReq.status == 200) {
            var text = XMLHttpReq.responseText;
            console.log(text);
        }
};
xhr.send(postData);

3.方法二:

采用虚拟表单进行提交​post​请求,代码如下:

function post(URL, PARAMS) {      
    var temp = document.createElement("form");      
    temp.action = URL;      
    temp.method = "post";      
    temp.style.display = "none";      
    for (var x in PARAMS) {      
        var opt = document.createElement("textarea");      
        opt.name = x;      
        opt.value = PARAMS[x];      
        // alert(opt.name)      
        temp.appendChild(opt);      
    }      
    document.body.appendChild(temp);      
    temp.submit();      
    return temp;      
}          
//调用方法 如      
post('pages/statisticsJsp/excel.action', {html :prnhtml,cm1:'sdsddsd',cm2:'haha'});

总结:

对于“html怎么写post请求?实现方法有哪几种方法?”这个问题,小编为大家分享的内容就是这样的了,当然如果你有更好的方式或者想法也可以和大家一起分享学习,对于在前端中的其他问题或者难点我们都可以在W3cschool中搜索相关的问题和知识点,在这个平台中都有很多的资料可以提供给大家使用和学习。