jquery - wait till function finishes

If I understand jquery and javqascript correctly, it is asyncronous. What I fail to understand is if it is asynchronus only the ajax part, the load and get... or everything in general.

For example if I need to append a list menu in form and have:

$('#id').append("<option value='1'>1</option>") - etc., in this demo the <select id="category> is missing

now I'd like:

$('#category option[value="1"]').attr('selected', 'selected');

Of course I'd like this to select the value 1 AFTER the menu is appened, not before as it doesn't exist.

I am wondering if the script waiting till append finishes and it is fase to write both lines one after another or is there a need here to put some callback function on the first one so that the second line executes after the append is done?

It works on my browser, but I have a fast computer, I am worried on some slow one it would try to select before the select is even appended if it is 开发者_StackOverflow中文版asynchronius.

Or is only ajax calls asynchronius? This is something obvious and beginner like, but there are no good keywords I could find to pinpoint this basic thing so I am asking here.

Only AJAX, setTimeout, setInterval and event handlers are asynchronous. Everything else runs synchronously.

So you can safely assume your first line has executed when the second line executes.

A good way to determine if someone executes asynchronously is checking if you pass a callback function. If you do so and it's something where the execution time depends on external factors (network speed) or it's something taking some time to execute (fading an element for example), chances are good that it executes asynchronously. However, something like $.each runs synchronously even though it works with a callback function. But in that case it's nothing where execution is artifically slowed down or depends on external factors so there's no reason for it to be asynchronously.

This is where deferred objects come in, and why the latest jQuery is great for finally having them:

For example:

$.when(appendMenu()).then
(
function ()
    {
    $('#category option[value="1"]').attr('selected', 'selected');
    }
);

function appendMenu ()
{
var dfd = $.Deferred();
$('#id').append("<option value='1'>1</option>");
dfd.resolve();
return dfd.promise();
}

http://api.jquery.com/category/deferred-object/

The concept basically allows you to control when code should be executed based on a promise policy - until a deferred object says it is done, the other code won't be run.

Though, honestly, I have a hard time picturing why these two simply calls don't happen near instantaneously; are you sure you don't have some other code slowing this process down, because I can generally always get away with those sorts of calls without deferred objects.

I was told that most browsers use a single thread to run javascript ( unless you explicitly enable multi-threaded mode in Chrome )

Alternatively you can do this way:

$('#id').append("<option value='1' selected='selected'>1</option>")