Question

113

JavaScript - How do I make sure a jQuery is loaded?

rated 0 times [ 120] [ 7] / answers: 1 / hits: 38429 / 15 Years ago, sun, july 12, 2009, 12:00:00

I have a web page. When this web page is loaded, I want to execute some JavaScript. This JavaScript uses JQuery. However, it appears that when the page is loaded, the jQuery library has not been fully loaded. Because of this, my JavaScript does not execute properly.

What are some best practices for ensuring that your jQuery library is loaded before executing your JavaScript?

Answers

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

estefanib

Add To Favorites

Follow

Total Points: 508

Total Questions: 104

Total Answers: 83

Location: Lebanon

Member since Sun, Aug 2, 2020

4 Years ago

estefanib questions

1 JavaScript - wait until element loaded on website using Chrome extension

Sat, Jul 10, 21, 00:00, 3 Years ago

1 How to auto close an alert after few seconds with Bootstrap?

Mon, Jun 28, 21, 00:00, 3 Years ago

1 What is the difference between a User and a GuildMember in discord.js?

Sun, Sep 20, 20, 00:00, 4 Years ago

1 react styled components style inner elements

Fri, Aug 21, 20, 00:00, 4 Years ago

1 How to automatically refresh an interactive grid after clicking on save button or at a fixed interval?

Wed, Jun 17, 20, 00:00, 4 Years ago

View All

answered 15 Years ago jaquelineh · Accepted Answer

The jQuery library should be included in the <head> part of your page:

<script src=/js/jquery-1.3.2.min.js type=text/javascript></script>

Your own code should come after this. JavaScript is loaded linearly and synchronously, so you don't have to worry about it as long as you include the scripts in order.

To make your code execute when the DOM has finished loading (because you can't really use much of the jQuery library until this happens), do this:

$(function () {

    // Do stuff to the DOM

    $('body').append('<p>Hello World!</p>');

});

If you're mixing JavaScript frameworks and they are interfering with each other, you may need to use jQuery like this:

jQuery(function ($) { // First argument is the jQuery object

    // Do stuff to the DOM

    $('body').append('<p>Hello World!</p>');

});