Javascript Questions

GOGETIA · Jun 8, 2011

Hey I just started learning javascript and im still getting used to it but i have some questions that i cant find anywhere

1.To start off, I heard somewhere that you had to have your website connected to the internet before javascript like clocks and stuff will work. I copied and pasted a little code into one of mine thats not online, and it worked. It wasnt a constantly updating clock, but it told the time right when the page was opened.

2. Is javascript basically linking stuff like html does? Are javascript effects already in the code, or does it pull the effect from somewhere else? If it does pull the effect from somewhere else then how are you supposed to make your own scripts and stuff? If it doesnt, then why are you supposed to have to be connected to the internet for javascript to work?

3. What do variables in javasrcipt do? I'm learning all this stuff on wc3schools.com or .net or whatever, and it goes into variables and numbers before it says what they do. I dont want to search through the whole thing just for it to give me a crappy answer that i wont understand. Can anybody explain what the point of numbers and variables are in javascript in a way that i would understand? (Im just learning javascript)

4. What exactly can javascript do? Im hearing a lot about how javascript is so awsome and it can do lots of stuff, but what exactly do people use it for? I havent seen a need for javascript since iv been making websites. Granted iv only been attempting HTML for a month or two I still dont really understand what the big fuss about javascript is. It seems that you can do almost anything with just html/Css.

The Helper · Jun 8, 2011

Java Script works with the Web Browser software (IE, Mozilla, Chrome, etc). You do not have to be connected to the net for scripts to work unless they are dependent on something on the internet. Java Script can be disabled in whatever browser someone is using so in order for Java Script to run, it must be in a browser that supports it.

http://www.w3schools.com/JS/default.asp

is a good resource, you can look at all the objects in Java Script, that can tell you what you can do. Quite alot actually can be done in Java Script.

GetTriggerUnit- · Jun 8, 2011

3. Javascript variables are like variables in maths. They hold values. Like a string, a number, a boolean. Those are quite basic programming concept. Is Javascript the first programming language you're learning?

4. It can manipulate the DOM (Document Object Model) e.g. change the background color of a div, make asynchronous request a.k.a AJAX (Sending an HTTP request to a server whithout the need of reloading the page), and it's part of DHTML (Interactive web pages, HTML + Javascript + CSS).

GOGETIA · Jun 8, 2011

Okay thanks Helper and Trigger.
Ya im using w3schools but its kinda hard to understand what they mean sometimes when i cant actually ask questions.
Yes, javascript is the first programming language im learning, so i dont really understand what boolean or strings are. I just dont see where they would actually be useful. Also i didnt understand any of what you said in #4, i mean whats an asynchronous request?!?! It just doesnt seem like theres that much that you cant do with HTML that you would need javascript for. Please give me an example because im confused.

GetTriggerUnit- · Jun 8, 2011

PHP:

<html>
<body>
    <button style="background-color:blue;" onmouseover="this.style.backgroundColor='red';" onmouseout="this.style.backgroundColor='blue';">Button</button>
</body>
</html>

When you move your mouse over the button, the background color changes to red and when your mouse goes out, it goes back to blue.
That can be done with CSS but let's not over complicate things.

PHP:

<html>
<head>
    <script type="text/javascript">
        window.onload = function () {
            var c = document.getElementById('celcius'); // Select our Celcius Input
            var f = document.getElementById('fahrenheit'); // Select our Fahrenheit Input
            
            c.onkeyup = function (e) { // Add an event to it, in this case KeyUp (which is triggered when you release a key of the keyboard)
                var celcius = parseFloat(c.value); // Convert the contents of the text box to a "Floating Point" like 35.5 or 26.7
                
                var fahrenheit = celcius * (9 / 5) + 32; // Convertion formula..
                
                f.value = Math.round(fahrenheit); // Round the result and put it the the fahrenheit box
            }
            
           // same thing as above...

            f.onkeyup = function (e) {
                var fahrenheit = parseFloat(f.value);
                
                var celcius = (fahrenheit - 32) * (5 / 9);
                
                c.value = Math.round(celcius);
            }
        }
    </script>
</head>
<body>
    <!-- Tables, yes! -->
    <table border="0px" cellpadding="10" cellspacing="0">
        <tr><td>Celclius</td><td><input id="celcius" type="text" /></td></tr>
        <tr><td>Fahrenheit</td><td><input id="fahrenheit" type="text" /></td></tr>
    </table>
</body>
</html>

This converts Celcius degrees to Fahrenheit degrees. Couldn't do that without Javascript...

GOGETIA · Jun 8, 2011

Wow that will take a while to get the conversion one, but thanks for the example i didnt think of anything like that

Lyerae · Jun 9, 2011

The Helper said:
http://www.w3schools.com/JS/default.asp

is a good resource, you can look at all the objects in Java Script, that can tell you what you can do. Quite alot actually can be done in Java Script.

You should take a look at this.

GOGETIA said:
3. What do variables in javasrcipt do? I'm learning all this stuff on wc3schools.com or .net or whatever, and it goes into variables and numbers before it says what they do. I dont want to search through the whole thing just for it to give me a crappy answer that i wont understand. Can anybody explain what the point of numbers and variables are in javascript in a way that i would understand? (Im just learning javascript)

4. What exactly can javascript do? Im hearing a lot about how javascript is so awsome and it can do lots of stuff, but what exactly do people use it for? I havent seen a need for javascript since iv been making websites. Granted iv only been attempting HTML for a month or two I still dont really understand what the big fuss about javascript is. It seems that you can do almost anything with just html/Css.

3)
Variables act as a placeholder for certain values. Things like strings, integers, booleans, objects, and the like.
A good example of a variable is:

Code:

var message = "Hello, world!";
alert(message);

That will alert "Hello, world!" into the browser. You can change around the string within the quotes to change what the browser will alert.

4)

JavaScript can do a lot. I've seen the Linux kernel run in it*, display 3D graphics in a way that lets you make full video games, I've seen a brainfuck implementation, etc.

JavaScript (in a browser) is really only limited by what you can do with the API's provided. In some older browsers, you only had the DOM (which you'll learn to hate, by the way), but in modern ones, you have these amazing API's that let you do some incredible things.

And some parting advice:
If you aren't already, use either Firefox or Google Chrome to develop. Both are amazing browsers, with really great support for all (most...) of the latest W3C / What-WG standards, and both have a really good JavaScript console (Firebug for FF, Chrome Dev Tools for Chrome) that can really help you debug code. I very much suggest you learn how to use at least one of these, as it will make your life a hell of a lot easier.

Another tip: 99% of JavaScript tutorials are complete crap. If you want a good one, head here: https://developer.mozilla.org/en-US/learn (You'll learn to love Mozilla's MDC.)
(*if you must see it, here's the Linux kernel: http://bellard.org/jslinux/index.html)

---

Edit: Oh, one last thing! Stay away from libraries such as jQuery, MooTools, and Prototype (as a few examples) until you have a good grasp on the core language. You don't want to become dependent on them.

Lyerae · Jun 9, 2011

GetTriggerUnit- said:
PHP:

<snip>

When you move your mouse over the button, the background color changes to red and when your mouse goes out, it goes back to blue.
That can be done with CSS but let's not over complicate things.

PHP:

<snip>

This converts Celcius degrees to Fahrenheit degrees. Couldn't do that without Javascript...

First one:

PHP:

<!DOCTYPE html>

<html lang="en" dir="ltr">
	<head>
		<title>Standard-compliancy is fun!</title>
		<meta charset="utf-8">
	</head>
	<body>
		<!-- 
		You should always implement your styles and scripts in an external file.
		This allows the browser to cache the file, reducing page load time.
		As this is an example though, we should be good. :D 
		
		also, I think this is the first time Ive used HTML comments in a couple years. o_o
		-->
		<input id="clickme" type="button" value="CLICK ME. YOU KNOW YOU WANT DO." style="background-color:blue;" />
		
		<script>
			(function() {
				var input = document.getElementById('clickme');
				input.onmouseover = function() {
					input.style.backgroundColor = 'red';
				}
				
				input.onmouseout = function() {
					input.style.backgroundColor = 'blue';
				}
			})();
		</script>
		
	</body>
</html>

Second one: You shouldn't have to wrap that around window.onload. Just reference it through an external document (which you should always do, for caching), and wrap it in an IIFE (immediately invoked function expression. It's also called an self-executing anonymous function. I wrapped the code above in one), and it should work the same (without having to use events.).

(I hate double-posting, but I didn't want the last one to be td;lr. If the mods want to merge them, feel free. )

GetTriggerUnit- · Jun 9, 2011

Sigh.

Why do people always have to come over and make a better code than one's code.

Honestly, you wasted your time making a much longer code that simply does the same f*cking thing.
Both codes are fully functional and respect the standars; therefore there's no reason for you to come over and scrap it.

window.onload isn't the demon. As long as there's no other libraries defening a callback for it, it's viable.

Also, using external linking for 20 lines of javascript is useless. It's just going to slow the loading; browsers do not load Javascript asynchronously, they wait for it to be downloaded.

Anyways, I hate such things as you probably noticed.
Didn't mean to hurt anyone's feelings and this message doesn't only apply to you Lyrae, don't take it personal.

Magentix · Jun 9, 2011

GetTriggerUnit- said:
Sigh.
Also, using external linking for 20 lines of javascript is useless. It's just going to slow the loading; browsers do not load Javascript asynchronously, they wait for it to be downloaded.

Lyerae's right about the externalizing. As soon as you have more than one page, an externalized JavaScript always beats inline code.
Also: inline code and styles may block the parallel downloading of stylesheets if you're not careful.

Lyerae said:
and wrap it in an IIFE (immediately invoked function expression. It's also called an self-executing anonymous function. I wrapped the code above in one)

For the love of God, it is not a self-executing anonymous function. It's an IIFE. There is nothing about the anonymous function in an IIFE that justifies the term 'self-executing'.
If you're going to promote 'good standards', you should start by getting your facts straight. Quotes like "Standard-compliancy is fun!" and then getting it wrong just looks ridiculous.

Javascript Questions

GOGETIA

New Member

The Helper

Necromancy Power over 9000

GetTriggerUnit-

DogEntrepreneur

GOGETIA

New Member

GetTriggerUnit-

DogEntrepreneur

GOGETIA

New Member

Lyerae

I keep popping up on this site from time to time.

Lyerae

I keep popping up on this site from time to time.

GetTriggerUnit-

DogEntrepreneur

Magentix

if (OP.statement == false) postCount++;

Settings Notifications

Options

The Helper Discord

Members online

Share this page

Affiliates

Network Sponsors

Javascript Questions

New Member

Necromancy Power over 9000

DogEntrepreneur

New Member

DogEntrepreneur

New Member

I keep popping up on this site from time to time.

I keep popping up on this site from time to time.

DogEntrepreneur

if (OP.statement == false) postCount++;

Log in

The Helper Discord

Share this page

Affiliates

Network Sponsors