Ex.
$(“p”).append(” some contents are appended”);
$(“p”).prepend(“Hello! “);
$(“p:last”).prepend(“p:first”);
Category Archives: jQuery
Manipulating Attribute
Ex.
$(“document”).ready( function() {
$(“a”).attr(“target”, “_blank”);
});
—
$(“a”).removeAttr(“href”);
$(“a”).attr({src:”img/test.jpg”, alt:”Spring”});
—
Manipulating Content
Ex.
$(“document”).ready( function() {
alert($(“#divname”).html());
});
—
Ex.
$(“document”).ready( function(){
var newItem = $(“<p>This is a new paragraph</p>”);
$(“#divname”).html(newItem.html());
$(“#divname2″).html(“<p>Another paragraph</p>”);
$(“p”).text(“hello there”);
});
Indentifying type
This is a sample code where it select a <a> tag which has a linked pdf and append an <img> tag after the <a> tag.
$(“document”).ready( function() {
$(“a[href$=.pdf]“).after(“<img src=’image/pdf-icon.jpg’ />
});
jQuery Statement Chaining
One of the mopst powerful features of jQuery is it allows multiple chaining of functions to perform several operations on a single line of code.
$(selector).fn1().fn2().fn3();
Traversing
Ex.
$(“document”).ready( function() {
alert(“There are” + $(“p”).length + ” <p> element”);
});
—
$(“document”).ready( function() {
var elems = $(“li”).get();
alert(“There are” + elems.length + ” <p> element”);
});
—
$(“document”).ready( function() {
$(“ul”).find(“li .b”).css(“border”, “1px solid #f00″);
});
—
$(“document”).ready( function() {
var leftmargin = 0;
var border = 3;
$(“p”).each( function() {
$(this).css(“border”, border + “px solid red”);
$(this).css(“margin-left”, leftmargin);
border += 2;
leftmargin += 10;
});
});
Forms
Ex.
$(“document”).ready( function() {
$(“form :text”).css(“border”, “1px solid #f00″);
});
—
$(“document”).ready( function() {
$(“form :text:enabled”).css(“border”, “1px solid #f00″);
});
—
$(“document”).ready( function() {
$(“form :checkbox:checked”).css(“border”, “1px solid #f00″);
});
—
