Archive

Posts Tagged ‘Javascript’

Basic Javascript and a bit of PHP

November 21st, 2009 Comments off

PHP and Javascript are programming languages designed to, when activated, write or alter CSS and HTML code in order to produce an effect.  Javascript is a client-side programming language while PHP is a server-side language, meaning that while Javascript works on your side of the connection on your computer PHP works on the server (what your computer is connected to).

Note: Javascript should not be confused with Java, as they are two very separate programming languages.  Javascript was based on a simplified version of Java, however Java is not an internet-programming language and is much more intricate.

PHP can be written directly in the body or linked to in a separate file in the <head>.  PHP tags look like this: <?php….……?>.

Javascript can also be written directly in the body or a separate file.  One surrounds the Javascript with the tags <script type=”text/javascript”> and </script>.

Comments in both PHP Javascript are written with two slashes: //.  These slashes comment-out the entire line to the right of the slashes.
Examples:    //Hello!
document.write(“Hello!”); //This will write “Hello!”

The most basic thing one can use PHP or Javascript for is to write text.  Both of the codes below will show up on a page looking exactly as though it was written in HTML instead of PHP or Javascript.

Javascript:
<script type=”text/javascript”>
document.write(“I wrote something in Javascript!”);
</script>

PHP:
<?php
$txt=”I wrote something in PHP!”;
echo $txt;
?>

The “$” in PHP signifies a variable.  Both PHP and Javascript use variables to store values, in this case, the text “I wrote something in PHP!”  Variables in Javascript are declared as “var [insert variable name];” Ex: var greeting;

In my project I decided to use Javascript to write a greeting at the top of my page.   Depending on the time of day and the day of the week, my website will greet you with “Happy Thursday morning!” or “Happy Saturday night!”  For this I used If…Else statements.  If…Else statements are rather straightforward: If X is true, do this, Else do that.  Additionally I used Case statements; if this is case 1, do this, if this is case 2, do that, etc.

At the top of my script I declared variables for the date, time, and day.  As a sidenote, in order to add CSS tags on the Javascript code (to make my text readable on the page and not black-on-default-black) I had to add “document.write(“<h3>”); at the top and document.write(“</h3>”); at the bottom.

My resulting script looks like this:

var d=new Date();

var theTime=d.getHours();

theDay=d.getDay();

document.write(“<h3>”);

switch (theDay)
{
case 0:
document.write(“Happy Sunday”);
break;
case 1:
document.write(“Happy Monday”);
break;
case 2:
document.write(“Happy Tuesday”);
break;
case 3:
document.write(“Happy Wednesday”);
break;
case 4:
document.write(“Happy Thursday”);
break;
case 5:
document.write(“Happy Friday”);
break;
case 6:
document.write(“Happy Saturday”);
}

if (theTime < 10)
document.write(” morning!”);
else if ((theTime >= 10) && (theTime < 14))
document.write(” lunchtime!”);
else if ((theTime > 14) && (theTime < 17))
document.write(” evening!”);
else
document.write(” night!”);

document.write(“</h3>”);

For much more detailed information on PHP or Javascript, search for them on the w3schools website: http://www.w3schools.com/

Happy coding!

Categories: Uncategorized Tags: ,