Javascript Questions

GOGETIA

New Member
Reaction score
0
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

Necromancy Power over 9000
Staff member
Reaction score
1,688
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-

DogEntrepreneur
Reaction score
129
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

New Member
Reaction score
0
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-

DogEntrepreneur
Reaction score
129
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

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

Lyerae

I keep popping up on this site from time to time.
Reaction score
105
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.

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

I keep popping up on this site from time to time.
Reaction score
105
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. :D)
 

GetTriggerUnit-

DogEntrepreneur
Reaction score
129
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

if (OP.statement == false) postCount++;
Reaction score
107
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.

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.
 
General chit-chat
Help Users
  • No one is chatting at the moment.

      The Helper Discord

      Staff online

      Members online

      Affiliates

      Hive Workshop NUON Dome World Editor Tutorials

      Network Sponsors

      Apex Steel Pipe - Buys and sells Steel Pipe.
      Top