Client Side Scripting: JavaScript

1. What is JavaScript?

JavaScript is a lightweight, interpreted, object-based scripting language that runs inside the browser (client side) and makes static HTML pages dynamic and interactive — form validation, DHTML effects, asynchronous data fetch, event handling.

Feature	Detail
Interpreted	No compilation; browser parses and runs the script
Case sensitive	`name` ≠ `Name`
Loosely typed	Variables hold any type: `var x = 5; x = "hi";`
Event driven	Responds to clicks, key presses, mouse moves, timers
Object-based	Built-in objects: `window, document, String, Array, Math, Date, RegExp`
Embedded	Inside `<script>` tags or external `.js` files

<script type="text/javascript">          <!-- inline -->
  alert("Hello");
</script>
<script src="myscript.js"></script>      <!-- external file -->
<button onclick="calc()">Compute</button> <!-- event attribute -->
<a href="javascript:show()">Go</a>       <!-- pseudo-protocol -->

Common events: click, dblclick, mouseover, mouseout, keydown, keyup, change, submit, focus, blur, load, resize, timer (setTimeout/setInterval).

6. Popup Dialogs

alert("Hello");                          // message box
confirm("Delete record?");               // OK/Cancel -> boolean
prompt("Enter your name", "default");    // input -> string or null

7. Browser Objects (BOM)

Object	Role
`window`	Global object — `open()`, `close()`, `setTimeout()`, `location`, `history`
`location`	Current URL — `href`, `reload()`, `search`
`history`	`back()`, `forward()`, `go(-1)`
`navigator`	Browser info (name, version, platform)
`screen`	Screen resolution

8. Complete Example — Form Validation

<form name="f1" action="register.php" onsubmit="return validate()">
  Name:  <input type="text" name="nm">

  Email: <input type="text" name="em">

  <input type="submit" value="Register">
</form>
<script>
function validate() {
  var nm = document.f1.nm.value;
  var em = document.f1.em.value;
  if (nm.length < 3) { alert("Name too short"); return false; }
  if (em.indexOf("@") < 1 || em.indexOf(".") < 0) { alert("Bad email"); return false; }
  return true;   // true -> form submitted to server
}
</script>

9. Client-Side vs Server-Side Scripting

Aspect	Client-side (JavaScript)	Server-side (PHP/JSP)
Executes	In the browser	On the web server
Source visible to user	Yes (View Source)	No (only output is sent)
Access to DB/files	No (sandboxed)	Yes
Latency	Instant (no round trip)	Needs HTTP request
Uses	Validation, UI effects, AJAX	Business logic, DB, sessions

10. Advantages and Limitations

Advantages: immediate client-side validation reduces server load and round trips; rich interactivity (DHTML, AJAX); simple to learn/deploy (no install); platform independent; can access browser objects and local storage.

Limitations: dependent on browser settings (may be disabled) and DOM/engine differences; source code is visible; no file/database access; security limits (same-origin policy); debug difficulty in older browsers.

11. Exam Points

Explain the features of JavaScript with an example program — 7-10 marks.
Write JavaScript for a form validation (name, e-mail, password) — 10 marks (very frequent program).
Explain the document object and DOM methods with examples — 5-7 marks.
Client-side vs server-side scripting — 5 marks.
Short notes: events and event handlers, dialog boxes, window object — 3-5 marks.

Client Side Scripting: JavaScript