"converting .load (jquery) to pure javascript [closed]" Code Answer

not extact transalation but little help to get you going

 //selector , use document.getelementbyid    
    $('#group') => document.getelementbyid('group');

//to set the html
    $('#fetchmember').html => document.getelementbyid("fetchmember").innerhtml="'<center><img src="ajax-loader.gif"></center>'";


//to bind the click
    document.getelementbyid('group').addeventlistener('click', function() {
      console.log('bind click');
    });

for jquery load(), i think you can use an iframe and set it's source(the easy way, if fetchmember.php returns html).

or you can look at the load() method in jquery and try converting it in to pure js. here you will use pure xmlhttprequest instead of 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("<div>").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;
};

for $(document).ready(), write a self executing function at the end of your body. something like this

<body>
 custom html here

<script>
// self executing function 
(function() {
   // write all your js here

})();
</script>
</body>

By mzy on October 9 2022

Answers related to “converting .load (jquery) to pure javascript [closed]”

Only authorized users can answer the Search term. Please sign in first, or register a free account.

Browse Other Code Languages