Jquery Selectors and chaining

JavaScript
1

Hi Guys,
pretty easy question.
I haven’t used jquery for quite a while and I’m trying to simply alter out the text in a div with an ID of “test” but I’m running into trouble.


        var mytest = $("#test");
        alert(mytest);

I’m sure it’s because I’ve selected the div as a whole, but I’ve tried selecting the first child with no success.

I suppose I should first chain in a “p” selector, then select the first item, but I’m not quite sure how to do it.

What I think is my closest attempt is as follows:


        var mytest = $("#test").("p")[0];
        alert(mytest);

If anyone has any tips it would be appreciated.

thanks

2

perfect, thanks a lot works, beautifully.

3

When you use json.menu.popup.menuitem to access the array, the first item is at index 0, and the 3rd item is at index 2. So to get the value of the third item, resulting in “close”, you would use json.menu.popup.menuitem[2].value

Not with getJSON. A post at http://stackoverflow.com/questions/1002367/jquery-ajax-jsonp-ignores-a-timeout-and-doesnt-fire-the-error-event has a good solution for you there.

4

that’s perfect, thank you very much for your assistance.

5

sorry to re-post in a topic I just considered closed, but I’ve just come across a similar issue that I’d like some help with.

I’m playing with $getJSON and can select items where there’s 1 matching item, but am having trouble selecting a specific 1 when there are multiple matching items.

Below is my $getJSON jquery code:


$.getJSON("myExampleScripts/JSONExample1.js", function (json) {
            alert("JSON Data: " + json.menu.popup.menuitem.value);
        })

Below is the sample json that I’m working with:


{"menu": {
        "id": "file",
        "value": "File",
        "popup": {
            "menuitem": [
                {"value": "New", "onclick": "CreateNewDoc()"},
                {"value": "Open", "onclick": "OpenDoc()"},
                {"value": "Close", "onclick": "CloseDoc()"}
            ]
        }
    }}

If I want to alert out the menu’s id or value, I have no problems, but if I want to alert out the value item of the 3rd menu item within “popup”, then I run into trouble.

I’m not sure how to select specific ones, forgive me, JSON is quite new to me.

If it fails, is there no way to specify a function to handle it? (Should I use $.ajax instead if I want to specify error functions?)

6

The third one when counting from 0 would be number 2.

There are a couple of different ways.

You could use an eq selector:


$("#test p:eq(2)").html();

Or you could use the eq method:


$("#test p").eq(2).html();

One of the benefits of doing it the second way is that you can save $(“#test p”) to a variable, to retrieve different parts of it later. If it’s just a once-only things though then the first way can be more effective.

7

Ok, I dunno jQuery and my Javascript’s not all that great either, but
“menuitem”: [ <–

looks like we’re making an array (filled with key-value pairs where you have a lot of similar keys… is that allowed?).

So if it’s an array, you should be able to use array notation like
(otherstuff).menuitem[0] or .menutitem[1] or .menuitem[2]

I think. Anyway, you can try it if Paul doesn’t get back to this quickly.

8

I want to get the contents of the p tag in the test div.
If we assume it’s the first p tag in test how would I go about it.

Edit
After a quick look at the jquery docs, I can see that I just need to use:
$(“#test p”).html()
to get the first item, but what if I want the 3rd (just to help me understand it better)

9

$(“#test p”) will select all paragraphs in the test div, but if you’re just wanting to change the contents of the test div, you can use jQuery’s html method:

$("#test").html('<p>Some new content</p>');