js-3part原生js嘗試用Ajax
阿新 • • 發佈：2020-09-02
getElementsByName使用方法
如下是input標籤，我們嘗試從裡面獲取到csrf的value值。
這個csrf標籤，是隱藏的，在瀏覽器頁面element可以看到，在html原始碼裡面，是看不到如下的input標籤的
<input type="hidden" name="csrfmiddlewaretoken" value="fR1iMAQxRgiHEwopw1cnGgBDyNAx2jSBRE1bkfJsqWdZUea7HBviTK2nmmqJPCby">
真正在html原始碼裡面的寫法是這樣的：
<body> {% csrf_token %} </body>
用getElementsByName寫作如下格式
csrf_token = document.getElementsByName("csrfmiddlewaretoken")[0].value
getElementsByName獲取的是一個數組，所以取值，需要用索引，即便這個數組裡面，只有一個值，也需要用索引取值。然後指定到單個的值，才能用value拿到標籤裡面value的結果
原生js的Ajax寫法，這個在網上比較少，今天把簡單的用法寫下來
function ajax_func() { # 這是正常的函式定義 console.log("hello world"); # 這裡先測試函式是否生效 csrf_token= document.getElementsByName("csrfmiddlewaretoken")[0].value; # 接上面，嘗試獲取csrf標籤值 xmlhttp = new XMLHttpRequest(); xmlhttp.open("POST", "/manage_sys/try_write_attend/", true); # 設定method；url；最後一個引數，是否設定非同步請求，true非同步，false同步。 xmlhttp.setRequestHeader("x-csrftoken", csrf_token); # 設定csrf請求頭，這裡需要注意，在原生js裡面，請求頭的鍵就是”x-csrftoken“，這個跟jQuery的鍵不一樣。 xmlhttp.send() }