javascript怎么做表单提交?

Question

我的项目没有使用前后分离, 用的是模板;
很多情况不会在html里写form;
这种情况怎么在javascript中提交数据? 现在一直是用get方式不断拼参数;
另外, put和delete该怎么发起呢?

---

补充:
不好意思, 我说漏了, 不是用异步方式提交, 而是像表单提交那样, 提交后页面重新加载

Answer 1

js中通过ajax post调用post 方式的API 传值，同理delete，put

Answer 2

表单就是 application/x-www-urlencoded类型的字符串

var xhr = new XMLHttpRequest();
xhr.open('/api','POST',true);
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xhr.onload = function(){console.log(xhr.responseText)};
xhr.send('username=aaa&age=10');

put 和POST差不多，xhr.open那里改一下为PUT

delete和get差不多，xhr.open那里改一下为DELETE

Answer 3

我的理解是你要传递通过 Ajax 的方式将表单里的数据传到后台。
提交数据的方式主要有 application/x-www-urlencoded、application/json、multipart/form-data 这几种。

// application/x-www-urlencoded
let xhr = new XMLHttpRequest();
xhr.open(METHOD, URL);
xhr.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
xhr.send(QUERY_STRING); // "name=jasonxia23&password=123"
xhr.onload = () => {
    const res = JSON.parse(xhr.response);
    // todo
};

// application/json
let xhr = new XMLHttpRequest();
xhr.open(METHOD, URL);
xhr.setRequestHeader('Content-type', 'application/json');
xhr.send(JSON_STYLE_STRING); // "{"name":"jasonxia23","password":123}"
xhr.onload = () => {
    const res = JSON.parse(xhr.response);
    // todo
};

// multipart/form-data
let xhr = new XMLHttpRequest();
let formData = new FormData();
formData.append(KEY, VALUE);
xhr.open(METHOD, URL);
xhr.setRequestHeader('Content-type', 'multipart/form-data');
xhr.send(formData);
xhr.onload = () => {
    const res = JSON.parse(xhr.response);
    // todo
};