Do we need to use jQuery in your Web Application Project?

Well, there are so many sites which uses jQuery. Most of us are very much familiar that jQuery was very popular between 2007-2012, although its still using in many website across the internet. Below I am going to tell you what is very beneficial for using jQuery and why we should not use it.


Pros of using jQuery:

- It provides very handy commands for direct manipulation of DOM structure.
- You can easily change any style, attribute, elements, etc. with the help of desired selectors.
- There are couple of plugins availabe which basically works together with jQuery like: sliders, form validations, animation effects, and many more.


Cons of using jQuery:

- It only modifies DOM from interaction point of view and doesn't change the code. It means it will not effect any changes for the actual running code and at the time of refresh page your changes might be lost.
- You cannot generate dynamic code with jQuery, meaning You cannot run dynamic loops and properties based on programming languages, but that can be achievable via Angular/Reactjs/Vuejs/Next.js etc.
- Also, you don't need to consider your jQuery changes to be available in Search Engine crawling, because jQuery or javascript modifications/renderings will be completely ignored by Crawlers.

Why You Need Good JavaScript Tutorials

JavaScript allows you to change how a webpage looks completely. By using JavaScript you can change text, colors to drop-down list and much more. These scripts are integrated into the browsing environment. All you need to find good JavaScript tutorials for beginners to get started with JavaScript.

The popularity of JavaScript over the years has increased significantly and so as the demand for menu JavaScript tutorial and other such tutorials.
The reason for the popularity is basically because JavaScript offers a number of advantages. They are:

• JavaScript is executed on the user's processor instead of the web server thus it saves bandwidth and there is less load on the web server
• JavaScript is relatively easy to learn and comprises of syntax that is close to English
• As JavaScript code is executed on the user's computer, results and processing is completed almost instantly
• JavaScript offers extended functionalities to web pages

Therefore, use these advantages to your benefit. Start learning from the best JavaScript tutorials for beginners available in the internet. Get information specifically on menu JavaScript tutorial and other such tutorials and start experimenting.

These JavaScript tutorials for beginners allow you to even create extremely powerful browser games similar to flash games. Menu JavaScript tutorial and others will also help you create menu as well as UI related things.
Just like all other languages, JavaScript also has some best practices:

• Always Use 'var'
• Feature-Detect Rather Than Browser-Detect
• Use Square Bracket Notation
• Avoid 'eval'
• Reference Forms and Form Elements Correctly
• Avoid 'with' Statements
• Use onclick In Anchors Instead Of JavaScript: Pseudo-Protocol
• Use The Unary + Operator To TypeConvert To Number
• Avoid document.all
• Don't Use HTML Comments In Script Blocks
• Avoid Cluttering The Global Namespace
• Avoid sync "Ajax" calls
• Use JSON
• Use Correct script Tags

A good JavaScript tutorial for beginners would instruct you to keep testing, the changes you make. If your web page no longer works, you won’t necessarily know which change caused it to fail. Write your programs a step at a time and test often.
If you want to explore your learning through menu JavaScript tutorial and others, then explore JavaScript by writing simple scripts. One of the nice things about client-side JavaScript is that anyone with a web browser and a simple text editor has a complete development environment. You don’t need to buy or download special-purpose software in order to begin writing JavaScript.

Therefore, find out a good JavaScript tutorial for beginners and start learning it from today. Fortunately, there are many good and intuitive tutorial sites available on the Internet. These sites make it extremely easy and simple to learn JavaScript by offering all the details and necessary tools and demos.

They offer menu JavaScript tutorial and other very important tutorials that are in demand and most widely used. So, search some Internet and find out the best JavaScript tutorials offering the most practical tutorials for your knowledge.

Swap Images by XML using XMLHTTP Request

Calling XML file into HTML Page using XMLHTTP Request or ActiveXOject
Here, we have used some features for calling xml file into html document with the help of ajax. In the example mentioned below, we called xml nodes by using

item(0).firstChild.nodeValue

Below find the javascript code as a Example, as a result it shows toggle images effects.

Javascript file Source:

<script type="text/javascript">
function make()
{
var req;

if (window.XMLHttpRequest)
{
req = new XMLHttpRequest();
}
else if (window.ActiveXObject)
{
req = new ActiveXObject("Microsoft.XMLHTTP");
}

req.open("GET", "image.xml", true);
//req.load("ajax-get.xml");


req.onreadystatechange = function()
{
if(req.readyState == 4)
{
//alert(imgsrc);

var doc = req.responseXML;
var cont=document.getElementById("data");
var imgsrc=document.getElementById("pic");
var thumb=document.getElementById("pic_s");
var clickhere=document.getElementById("alink");

//var test = doc.getElementsByTagName('thumb');
var smallpic = doc.getElementsByTagName('thumb');
var lnkxml = doc.getElementsByTagName('link');

imgsrc.src = doc.getElementsByTagName('image').item(0).firstChild.nodeValue;
imgsrc.alt = doc.getElementsByTagName('alt').item(0).firstChild.nodeValue;
thumb.src = smallpic.item(0).firstChild.nodeValue;
clickhere.href = lnkxml.item(0).firstChild.nodeValue;


var rot=document.getElementById("spn1");
rot.innerHTML= smallpic.item(0).firstChild.nodeValue;

thumb.onclick=function()
{

//if(thumb.src==smallpic.item(1).firstChild.nodeValue)
if(rot.innerHTML==smallpic.item(1).firstChild.nodeValue)
{
imgsrc.src = doc.getElementsByTagName('image').item(0).firstChild.nodeValue;
imgsrc.alt = doc.getElementsByTagName('alt').item(0).firstChild.nodeValue;
thumb.src = smallpic.item(0).firstChild.nodeValue;
clickhere.href = lnkxml.item(0).firstChild.nodeValue;

rot.innerHTML= smallpic.item(0).firstChild.nodeValue;
}
else
{
imgsrc.src = doc.getElementsByTagName('image').item(1).firstChild.nodeValue;
imgsrc.alt = doc.getElementsByTagName('alt').item(1).firstChild.nodeValue;
thumb.src = smallpic.item(1).firstChild.nodeValue;
clickhere.href = lnkxml.item(1).firstChild.nodeValue;

rot.innerHTML= smallpic.item(1).firstChild.nodeValue;
}
//alert(thumb.src);
};
}


};

/* else if(req.readyState<4)
{
shots.innerHTML="Loading...";
}*/
req.send(null);
}

</script>

XML file Source:

<?xml version="1.0"?>
<root>
<image>images/img-1.jpg</image>
<thumb>images/thumb-1.jpg</thumb>
<alt>XML</alt>
<link>http://javascript-guru.blogspot.com/search/label/ajax/</link>
<image>images/img-2.jpg</image>
<thumb>images/thumb-2.jpg</thumb>
<alt>Ajax</alt>
<link>http://javascript-guru.blogspot.com/</link>
</root>

Quick Tips & Tricks for Websites

Quick Tips for making Websites Sensible

1.Images & animations: Use the alt attribute to describe the function of each visual.

2.Image maps: Use the client-side map and text for hotspots.

3.Multimedia: Provide captioning and transcripts of audio, and descriptions of video.

4.Hypertext links: Use text that makes sense when read out of context. For example, avoid "click here."

5.Page organization: Use headings, lists, and consistent structure. Use CSS for layout and style where possible.

6.Graphs & charts: Summarize or use the longdesc attribute.

7.Scripts, applets, & plug-ins: Provide alternative content in case active features are inaccessible or unsupported.

8.Frames: Use the “noframes” element and meaningful titles.

9.Tables: Make line-by-line reading sensible. Summarize.

10.Check your work: Validate. Use tools, checklist, and guidelines at http://www.w3.org/TR/WCAG

Top 10 CSS image gallery tutorials

There are many tutorials out there on how to create your own image gallery. There are simple ones made from pure CSS, and there are complex ones using css and javascript. By the end of this article you will have the information necessary to start building your own photo gallery.

read more | digg story

CSS hover with JavaScript animation methods

The CSS rollover effects is commonly used in jQuery Frameworks, suppose hover animations that respond to a user's behavior in ways standards-based sites never could before.

read more | digg story

Introduction to Regular Expressions - RegExp( )

Regular Expressions are very useful and commonly used for creating pattern matches, pattern searches, etc. for Strings in JavaScript. There is another method called indexOf() method which works almost same like regular expressions but for advance and complex pattern searches, regular expressions are used.

For creating a regular expression as an object, we can simply write:

new RegExp("\/D\");

Regular expressions are clearly defined by example given below:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

<script language="JavaScript">
<!--
// created BY: rjs
function demoMatchClick()
{
var re =/[0-9]/g;
// For Numeric Value use /[0-9]/ or /\d/ and for non-numeric value use /\D/ or /[^0-9]/
// /[0-9a-zA-Z] for numeric as well as character(small/caps) for non-aplha --> use this /[^a-zA-Z]/.
// /[^a-zA-Z]/g here (g) for global search anywhere in the string even mix-up string.

// match(), search(), replace(), split()
// For Constructor -----> exec(), compile(), test()

var mat=document.demoMatch.subject.value.match(re);

if (mat)
{
alert(mat);
}
else
{
alert("No match");
}
}

</script>
</head>

<body>
<form id="demoMatch" NAME="demoMatch" METHOD="POST">
<P>Subject Number: <INPUT TYPE=TEXT NAME="subject"
VALUE="" SIZE=50></P>
<P><INPUT TYPE=SUBMIT VALUE="Test Match" ONCLICK="demoMatchClick()"></P>
</form>
</body>

Other Useful Resources:
• Javascript Completed Reference - Regular Expressions
• Basics of Regular Expressions