相当于没有jQuery的$ .load [英] Equivalent to $.load without jQuery

问题描述

我想在点击按钮时将一些Jade内容加载到某个div中。我已经找到了如何用jquery做这个，有几个帖子，基本上我想做的是

I want to load some Jade content into a certain div on button click. I have found how to do this with jquery, there are several posts on it, and essentially what I want to do is

$('#div').load('/somePage');

但是，我无法在项目中使用jQuery。在vanilla javascript中是否有等效函数？

However, I am unable to use jQuery in my project. Is there an equivalent function in vanilla javascript?

推荐答案

我认为您可以使用以下内容执行此操作;

I think you can do this with the following;

var request = new XMLHttpRequest();

request.open('GET', '/somepage', true);

request.onload = function() {
  if (request.status >= 200 && request.status < 400) {
    var resp = request.responseText;

    document.querySelector('#div').innerHTML = resp;
  }
};

request.send();

顺便说一下，你也可以使用fetch API来做到这一点。

By the way, you can do this with fetch API too.

fetch('/somepage')
  .then(function(response) {
    return response.text();
  })
  .then(function(body) {
    document.querySelector('#div').innerHTML = body;
  });

顺便说一句，你可以阅读此博客文章，用于了解有关fetch API的信息。

By the way, you can read this blog post for learning something about fetch API.

这篇关于相当于没有jQuery的$ .load的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！