LinuxQuestions.org

LinuxQuestions.org (/questions/)
-   Programming (https://www.linuxquestions.org/questions/programming-9/)
-   -   What is Json and jQuery and how are they related to Javascript? (https://www.linuxquestions.org/questions/programming-9/what-is-json-and-jquery-and-how-are-they-related-to-javascript-747325/)

Romanus81 08-13-2009 12:31 PM

What is Json and jQuery and how are they related to Javascript?
 
This summer I started a web design internship, mainly doing html and css, the other day my boss told me to learn jquery and use json to create a sort of gallery type thing.
The idea is: I add an entry into a json file, for every entry in the json file I put a small square at the bottom of the screen, and when you press that button some image and text above update.

I BS'ed my way through some of it, most of it I think is a test so he can see what I can do, so I'm not looking for answers, just an explanation of what I'm doing.

Here is what I've been using as "json":
Code:

var gallery_content = {
        "content" : [
                {
                        "text"        : "Text for image 1",
                        "image" : "gallery_image_00.jpg"
                },
                {
                        "text"  : "Text for image 2",
                        "image" : "gallery_image_01.jpg"
                }
        ]
}

and then this is the script I'm using in addition to jQuery 1.3.2, eplaination will follow
Code:

$(document).ready(function(){
        // when I click a button, assign variable based on the button...
        $("div.gallery_button").click(function() {
                var gallery_id = this.id.slice(15);
                //...then load text and image
                $('#gallery_text_area').html(gallery_content.content[gallery_id].text);
                $('#gallery_image').css("background-image",'url(' + gallery_content.content[gallery_id].image + ')');
                });
        });

> User clicks a small square div at the bottom with an id of "gallery_select_##".
> A slice function cuts that to just the "##" and assigns it to a variable.
> Then inserts it into the gallery_content.content[##].{text/image} variable from the "json"
> Then that variable, reading e.g., gallery_content.content[1].text, returns the text for that object and puts it into the designated spot.

So did I use json? Can someone explain to me what json is? It seems to me to be just a part of jquery. Thank you for your help.

neonsignal 08-13-2009 09:35 PM

json is just a data format that is based on a subset of javascript. It is independent of the libraries (or even language) used to access it. This data can exist in a standalone file. In your case, you have initialized a variable with a JSON data string.

jquery is a javascript library designed to assist in the manipulation of html. It provides some assistance in using the json format ('getJSON'), but that is just a small part of it.

As an example, the flickr api provides a means of fetching their search engine results in json format, so that the local javascript application doesn't have to do messy things like parse the html output of the search engine.


All times are GMT -5. The time now is 02:51 AM.