Webolution Designs Musings

Various posts on technology (code/programming). Our hope is that these posts improve your world.

Recent blog posts

Posted by on in JavaScript
Gimme a Timeout!

Today I want to talk about some of the timing features of JavaScript. Every programming language has the ability to work with time in some fashion. JavaScript is no different. The first one I want to discuss is setTimeout(). The setTimeout() method calls a function or evaluates an expression after a set number of milliseconds. Let me digress for a moment on milliseconds as that is a bit odd for us humans to think through at first. Computers think in terms of milliseconds, while we humans think in terms of seconds as the shortest time frame (typically...unless you are running in the Olympic games). So we need to keep in mind that one (1) second is equal to one thousand (1000) milliseconds. This is important when we are working with timing functionality.

So...digression over...back to setTimeout(). Again, it runs a function or evaluates an expression. Let's look at an example...

// Write a function that runs the setTimeout() method
function myTimeoutFunction() {
    setTimeout(function(){alert("It works!")}, 3000);

If we put the above code in a script tag and attach myTimeoutFunction to a button, then when we click that button, the setTimeout() method/function will run. So, it will alert the phrase "It works!" after three seconds.

Hits: 229
Rate this blog entry:

Posted by on in Programming
Clients, Servers & Scripts...Oh My!

In my programming tasks, I utilize JavaScript a ton, but how does JavaScript fit into the world around us, the web world and our various applications? In the past, there were people that were web designers and there were web developers. The two did not 'speak the same language'. Those days are long gone. To be a good designer, you have to understand development and vice versa. For example, if a web designer is creating a modern interface, it is not uncommon to utilize a JavaScript UI library (jQuery UI, Script.aculo.us, etc.) to provide a rich internet application (RIA). If you do not have a solid understanding of JavaScript, you will run into difficulties in attempting to use these resources. 

So where does JavaScript fit into the puzzle? JavaScript has been around a long time and is a mature language. It is an interpreted language. What that means is each browser has a JS Interpreter built in. When the browser hits JS code, it asks the interpreter to take over and tell the browser what it means. This is different than a compiled language, such as C# or Java. These languages are compiled into packages before their code can be executed.

JavaScript is traditionally a client-side language. What that means is the code is read on the end user's machine within their browser, not on the web server. I say traditionally, because over the past several years, there has been a growth in server-side/enterprise JS and JS libraries (Node, Dart, TypeScript). Let's stick with the traditional usage, however. So, on the client-side, we use the browser, which combines our content (HTML), style/layout (CSS) and our functionality (JS) to provide the web site experience. I call this the 'three-legged stool' of a web app.

Hits: 286
Rate this blog entry:

Posted by on in JavaScript
Write It Out

Today, I wish to talk about another built-in JavaScript function...document.write(). The write() method does what it sounds like...write out information to the page. Let's dive into an example...

// Use document.write() to write text to the page
document.write("This will show on the page.");

 As you can see, we can pass string text to the method and it will display it. A more powerful use, however, is to pass variables to it. Whatever the value our variable holds will display on the screen using the write() method.

// Variable to hold data
var myString = "Clay";
// Output data to the screen
document.write("Hello, " + myVar + ", how are you today?");

 When we run the above snippet of code, it will output as follows...

Hits: 343
Rate this blog entry:

Posted by on in JavaScript
Show Me Your ID

Today, I want to discuss interacting with your HTML content. Many times in JavaScript programming, we wish to interact/affect our HTML content in some fashion. We may want to add, remove or change content. So how do we go about doing that? TO accomplish this, we need to set up our HTML correctly and then code our JavaScript for our HTML. Let's look at how we might do that...

In HTML, we need to ensure we set up our structure of our content appropriately. One aspect of this is utilizing the ID attribute. WHen I build web apps, I usually ID and class (which we will talk about in a future post) a ton of stuff. This allows me to utilize not only proper JavaScript coding, but also CSS to make  my apps 'prettified'. So what does this ID attribute look like?

<div id="myDiv">
    Some content...

As you can see, I have an ID attribute on my div entitled, 'myDiv'. We can put IDs on virtually any HTML tag. The only real rule is that each ID needs to be unique on a page. In other words, I cannot have two 'myDiv' IDs on the same HTML page.

Hits: 300
Rate this blog entry:

Posted by on in JavaScript
Fix Your Decimal Please

Today I would like to discuss a handy function when we are working with decimal numbers...toFixed. What this does is truncate a decimal number to whatever number of spaces we pass to the toFixed method. So if we are working with money, for example, we can truncate a calculation to two decimal places...toFixed(2). Here is an example...

// Create a variable to house a decimal
var myNum = 10.123;
// Display the number truncated

 The aforementioned code would display as follows...

toFixed example one

Hits: 384
Rate this blog entry:


Every teacher should be this way Outstanding Training, Outstanding Support, Outstanding Example...Every developer should follow this guy!

male studentBob Stevenson

And your training is great! For me the support for my degree is the most important thing, and you really understand what you are doing.

female graduateAchim

Get in touch

Go to top