JQuery is Java Script library or Java Script Framework which helps in how to traverse HTML documents, do some cool animations, and add Ajax interaction to any web page. It mainly helps programmer to reduce lines of code as huge code written in Java Script, can be done easily with JQuery in few lines.
1. What are the different type of selectors in Jquery?
1. CSS Selector
Examples:
Hide all Paragraph elements that contain a class attribute:
$("p[@class]").hide();
Show the first paragraph on the page:
$("p:eq(0)").show();
Hide all divs that are currently showing:
$("div:visible").hide();
2. XPath Selector (XML Path)
* Relative to the entire HTML document
$("/html/body//p")
$("body//p")
$("p/../div")
3. Custom Selector
Examples:
$("p:first").css("fontWeight","bold");
$("div:hidden").show();
$("/div:contains('test')", this).hide();
More Reference: http://docs.jquery.com/DOM/Traversing/Selectors#XPath_Selectors
4. Tell some methods of JQuery used to provide effects?
1. Show()
2. Hide()
3. Toggle()
4. FadeIn()
5. FadeOut()
5. Whats the Features of Jquery?
1. One can easily provide effects and can do animations.
2. Applying / Changing CSS.
3. Cool plugins.
4. Ajax support
5. DOM selection events
6. Event Handling
6. Whats the onload function in JQuery?
$(document).ready(function() {
// put all your jQuery goodness in here.
});
* Everything inside it will load as soon as the DOM is loaded and before the page contents are loaded.
7. What is build in data types in Javascript?
a) String, Number, Boolean, Object, Array,
8. What is the usage of jQuery noConflict?
* jQuery.noConflict( [ removeAll ] )
* removeAll Boolean indicating whether to remove all jQuery variables from the global scope (including jQuery itself).
Many JavaScript libraries use $ as a function or variable name, just as jQuery does. In jQuery's case, $ is just an alias for jQuery, so all functionality is available without using $. If we need to use another JavaScript library alongside jQuery, we can return control of $ back to the other library with a call to $.noConflict():
jQuery Events
« Previous Next Chapter »
jQuery is tailor made to handle events.
jQuery Event Functions
The jQuery event handling functions are core functions in jQuery.
Event handlers are functions that are called when "something happens" in HTML. The term "triggered (or "fired") by an event" is often used.
It is common to put jQuery code into event handler functions in the "head" section:
Example
<html>
<head>
From w3schools.com
jQuery Name Conflicts
jQuery uses the $ sign as a shortcut for jQuery.
Some other JavaScript libraries also use the dollar sign for their functions.
The jQuery noConflict() method specifies a custom name (like jq), instead of using the dollar sign.
jQuery Events
$(document).ready(function)
Binds a function to the ready event of a document (when the document is finished loading)
$(selector).click(function)
Triggers, or binds a function to the click event of selected elements
$(selector).dblclick(function)
Triggers, or binds a function to the double click event of selected elements
$(selector).focus(function)
Triggers, or binds a function to the focus event of selected elements
$(selector).mouseover(function)
Triggers, or binds a function to the mouseover event of selected elements
jQuery Selectors
*** Selectors allow you to manipulate DOM elements as a group or as a single node.
jQuery Element Selectors
jQuery uses CSS selectors to select HTML elements.
$("p") selects all
elements.
$("p.intro") selects all
elements with class="intro".
$("p#demo") selects the first
element with id="demo".
jQuery Attribute Selectors
jQuery uses XPath expressions to select elements with given attributes.
$("[href]") select all elements with an href attribute.
$("[href='#']") select all elements with an href value equal to "#".
$("[href!='#']") select all elements with an href attribute NOT equal to "#".
$("[href$='.jpg']") select all elements with an href attribute that ends with ".jpg".
jQuery CSS Selectors
jQuery CSS selectors can be used to change CSS properties for HTML elements.
The following example changes the background-color of all p elements to yellow:
Example
$("p").css("background-color","yellow");
No comments:
Post a Comment