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 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: 83
Rate this blog entry:
0

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: 107
Rate this blog entry:
0

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...
</div>

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: 99
Rate this blog entry:
0

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
document.write(myNum.toFixed(2));

 The aforementioned code would display as follows...

toFixed example one

...
Hits: 110
Rate this blog entry:
0

Posted by on in JavaScript
O' String Search Thyself

All of us have used search features before. Most searches (such as Google) hit a database directory of some sort. There is a function in JavaScript that allows you to search through a string and find out if a string contains certain text. This function is called indexOf(). In fact, we can have a string search itself. Very introspective isn't it? Let's see how it works...

// Create a string variable
var str = "Hello everyone, JavaScript is cool!";
// Use indexOf() to search string
var n = str.indexOf("JavaScript");
// Output results
document.write(n);

 As you can see, we have a string. In this case, the string is stored in a variable. We can then call on the indexOf() method to search the string. All we need to do is pass to the method the content for which we are searching. In this case, the word, 'JavaScript'. So what would this return? It would return the value of '16'. So the variable n now has a value of 16. Why does it return '16? This is the position where the found characters begin (this includes spaces and is zero based)...

0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
H e l l o   e v e r y o n e ,   J

What if we are searching for something that does not get found? If this occurs, the indexOf() method returns '-1'. 

...
Hits: 99
Rate this blog entry:
0

Testimonials

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

male studentBob Stevenson
Student

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
Student

Get in touch

Go to top