将.load（jquery）转换为纯javascript

这是我的jquery代码：

  
  Choose your group.. <?php foreach ($userGroups['data'] as $groups) { echo "".$groups['name'].""; }?>  
      $('#group').on('change',function(){ var id_group = this.value; $('#fetchmember').html(''); $('#fetchmember').load('fetchmember.php?group='+id_group); });    

fetchmember.php：

 api('/'.$groupId.'/members'); $membergroup = $groupmember['data']; foreach ($membergroup as $membergroups) { echo "
".$membergroups['name']."
"; } ?> 

如何在纯JavaScript中创建.load？ 我必须将我的所有jquery代码转换为纯javascript代码，但我不知道用纯javascript加载fetchmember.php?group='+id_group 。 有人可以给我建议吗？

非常感谢

Answer 1

不接受翻译，但没有帮助你去

  //selector , use document.getElementById $('#group') => document.getElementById('group'); //to set the html $('#fetchmember').html => document.getElementById("fetchmember").innerHTML="''"; //to bind the click document.getElementById('group').addEventListener('click', function() { console.log('bind click'); }); 

对于jquery load() ，我认为您可以使用iframe并设置它的源代码（如果fetchmember.php返回HTML，则很简单）。

或者你可以在JQuery中查看load（）方法并尝试将其转换为纯js。 在这里，您将使用纯XMLHttpRequest而不是Jquery.Ajax()

 jQuery.fn.load = function( url, params, callback ) { if ( typeof url !== "string" && _load ) { return _load.apply( this, arguments ); } var selector, response, type, self = this, off = url.indexOf(" "); if ( off >= 0 ) { selector = url.slice( off, url.length ); url = url.slice( 0, off ); } // If it's a function if ( jQuery.isFunction( params ) ) { // We assume that it's the callback callback = params; params = undefined; // Otherwise, build a param string } else if ( params && typeof params === "object" ) { type = "POST"; } // If we have elements to modify, make the request if ( self.length > 0 ) { jQuery.ajax({ url: url, // if "type" variable is undefined, then "GET" method will be used type: type, dataType: "html", data: params }).done(function( responseText ) { // Save response for use in complete callback response = arguments; self.html( selector ? // If a selector was specified, locate the right elements in a dummy div // Exclude scripts to avoid IE 'Permission Denied' errors jQuery("
").append( jQuery.parseHTML( responseText ) ).find( selector ) : // Otherwise use the full result responseText ); }).complete( callback && function( jqXHR, status ) { self.each( callback, response || [ jqXHR.responseText, status, jqXHR ] ); }); } return this; }; 

对于$(document).ready() ，在身体的末尾写一个自执行函数。 像这样的东西

  Custom HTML HERE