結論から
fetch(url) .then(res => res.text()) .then(text => new DOMParser().parseFromString(text, "text/html"))
返ってきた値にnew DOMParser().parseFromString(text, "text/html"))
する!!
経緯
XMLHttpRequestと似たものにFetchAPIがある。
Promiseを返してくれるので.then
であれこれしやすくて便利なのだけど、使ってみたところ返ってきたレスポンスの中身をDOMとして扱えなくて困った。
FetchAPIにはリクエスト/レスポンスのBodyを決めるやつが実装されている
これにDOMとしてくれるやつがなくて素直に扱えなくてハマった。
XMLHttpRequestだったなら……
こちらにある通り
xhr = new XMLHttpRequest() xhr.responseType = "document"
こうすればDOMとして扱えるのだが…
document.querySelectorしたい問題
欲求としては返ってきたものに対して、そこからさらにdocument.querySelector
して特定のDOMを抜き出したいと思っていた。
とりあえずDOMとして扱えないかダメ元でテキストとして扱ってみた(response.text()
した)。
見ての通りテキストデータとなっていてダメ。当然このあとにquerySelectorしてみたけどNG。
DOMparser()や!
ありがとうstackoverflow…
DOMとして扱えている!
助かった。