top button
Flag Notify
    Connect to us
      Facebook Login
      Site Registration Why to Join

Facebook Login
Site Registration

What is unobtrusive javascript?

+9 votes
69 views

How to add behavior to an element using javascript?

posted Feb 5, 2014 by Asmita Agrawal

Share this question
Facebook Share Button Twitter Share Button Google+ Share Button LinkedIn Share Button Multiple Social Share Button

2 Answers

+1 vote

Unobtrusive JavaScript is a general approach to the use of JavaScript in web pages.

enter image description here

how can i add one more behavior to this using JavaScript is below

alert("say hello again");
sayGoodMorning()

answer Feb 6, 2014 by Hiteshwar Thakur
+1 vote

"Unobtrusive JavaScript" is a general approach to the use of JavaScript in web pages. Though the term is not formally defined, its basic principles are generally understood to include:

  1. Separation of functionality (the "behavior layer") from a Web page's structure/content and presentation
  2. Best practices to avoid the problems of traditional JavaScript programming (such as browser inconsistencies and lack of scalability)
  3. Progressive enhancement to support user agents that may not support advanced JavaScript functionality.

So it is basically separating behavior or javascript from presentation or html.

Example:

<input type="button" id="btn" onclick="alert('Test')" />

That is not unobstrusive javascript because behaviour and presentation are mixed. The onclick shouldn't be there in html and should be part of javascript itself not html.

With above example, you can go unobstrusive like this:

<input type="button" id="btn" />

JavaScript:

var el = document.getElementById('btn');
el.onclick = function(){
  alert('Test');
};

That time we have separated javascript from html with a very basic example.

answer Feb 6, 2014 by anonymous
Similar Questions
Contact Us
+91 9880187415
sales@queryhome.net
support@queryhome.net
#280, 3rd floor, 5th Main
6th Sector, HSR Layout
Bangalore-560102
Karnataka INDIA.
QUERY HOME
...