web design and jQuery introduction in persian
Download as PPSX, PDF0 likes416 views
This document contains code snippets and explanations of various JavaScript libraries and frameworks including jQuery, MooTools, Dojo, YUI, and Prototype. It provides examples of how to select and manipulate DOM elements, attach event handlers, and make AJAX requests using each of the libraries. Charts are included showing search trends for the different frameworks on Google over time. Contact information and links are also provided for an individual promoting jQuery learning resources in Iran.
![Dojo
fooNode = dojo.byId(“foo”);
fooConnections = [];
fooConnections.push(dojo.connect(fooNode, „onclick‟, foo));
YUI jQuery Prototype
function handleClick(e) { $(“foo”).observe(“click”, function() {
$(„#foo‟).click(function() {
Y.log(e); }); alert(„Clicked!‟);
} });
YUI().use(„node-base‟, function(Y)
{
Y.on(“click”, handleClick, “#foo”);
});
MooTools
$(„foo‟).addEvent(„click‟, function() {}));](https://image.slidesharecdn.com/myjquerypresentation-121218132025-phpapp01/85/web-design-and-jQuery-introduction-in-persian-30-320.jpg)
![Javascript
var p= document.getElementByTagName(„p‟);
for (i = 0; i < p.length; i++) {
p[i].style.display = „none‟;
}
jQuery
$(„p‟).hide();](https://image.slidesharecdn.com/myjquerypresentation-121218132025-phpapp01/85/web-design-and-jQuery-introduction-in-persian-32-320.jpg)
![if (!document.ELEMENT_NODE) { document.ELEMENT_NODE = 1;
document.ATTRIBUTE_NODE = 2; document.TEXT_NODE = 3;
document.CDATA_SECTION_NODE = 4; document.ENTITY_REFERENCE_NODE = 5;
document.ENTITY_NODE = 6; document.PROCESSING_INSTRUCTION_NODE = 7;
document.COMMENT_NODE = 8; document.DOCUMENT_NODE = 9;
document.DOCUMENT_TYPE_NODE = 10; document.DOCUMENT_FRAGMENT_NODE = 11;
document.NOTATION_NODE = 12; } document._importNode =
function(node, allChildren) { switch (node.nodeType) { case
document.ELEMENT_NODE: var newNode = document.createElement(node »
$(“#content”).load(“page.html #content”);
.nodeName); /* does the node have any attributes to add? */ if
(node.attributes && node.attributes » .length > 0) for (var i = 0; il =
node.attributes.length; » i < il) newNode.setAttribute(node.attributes »
.nodeName, node.getAttribute(node.attributes[i++] » .nodeName)); /* are we
going after children too, and does » the node have any? */ if (allChildren
&& node.childNodes && » node.childNodes.length > 0) for (var i = 0; il =
node.childNodes.length; » i < il) newNode.appendChild(document._importNode »
(node.childNodes[i++], allChildren)); return newNode; break; case
document.TEXT_NODE: case document.CDATA_SECTION_NODE: case
document.COMMENT_NODE: return document.createTextNode(node.nodeValue);
break; } };](https://image.slidesharecdn.com/myjquerypresentation-121218132025-phpapp01/85/web-design-and-jQuery-introduction-in-persian-33-320.jpg)
web design and jQuery introduction in persian
- 4. – – –
- 6. IT
- 8. IT
- 9. IT 25.02 $90,000 22.58 $78,000 21.49 $75,000 17.48 $114,000 18.73 $77,000 11.78 $71,000 15.93 $63,000 10.32 $99,000 4.24 $97,000 9.03 $78,000
- 17. –
- 18. HTML <html> <head> <title>This is a web page<title> </head> <body> <div> <p>I m a paragraph 1</p> <p>I m a paragraph 2</p> </div> <p>I m another paragraph</p> </body> </html>
- 20. – –
- 21. HTML <html> <head> <title>This is a web page<title> <style> p{ color:red; font-family:tahoma; } </style> </head> <body> <div> <p>I m a paragraph 1</p> <p>I m a paragraph 2</p> </div> <p>I m another paragraph</p> </body> </html>
- 23. – – –
- 26. 52.5 50 40 30 20 10 5 3.8 3 2.9 1.5 0.6 0.2 0.1 0
- 30. Dojo fooNode = dojo.byId(“foo”); fooConnections = []; fooConnections.push(dojo.connect(fooNode, „onclick‟, foo)); YUI jQuery Prototype function handleClick(e) { $(“foo”).observe(“click”, function() { $(„#foo‟).click(function() { Y.log(e); }); alert(„Clicked!‟); } }); YUI().use(„node-base‟, function(Y) { Y.on(“click”, handleClick, “#foo”); }); MooTools $(„foo‟).addEvent(„click‟, function() {}));
- 32. Javascript var p= document.getElementByTagName(„p‟); for (i = 0; i < p.length; i++) { p[i].style.display = „none‟; } jQuery $(„p‟).hide();
- 33. if (!document.ELEMENT_NODE) { document.ELEMENT_NODE = 1; document.ATTRIBUTE_NODE = 2; document.TEXT_NODE = 3; document.CDATA_SECTION_NODE = 4; document.ENTITY_REFERENCE_NODE = 5; document.ENTITY_NODE = 6; document.PROCESSING_INSTRUCTION_NODE = 7; document.COMMENT_NODE = 8; document.DOCUMENT_NODE = 9; document.DOCUMENT_TYPE_NODE = 10; document.DOCUMENT_FRAGMENT_NODE = 11; document.NOTATION_NODE = 12; } document._importNode = function(node, allChildren) { switch (node.nodeType) { case document.ELEMENT_NODE: var newNode = document.createElement(node » $(“#content”).load(“page.html #content”); .nodeName); /* does the node have any attributes to add? */ if (node.attributes && node.attributes » .length > 0) for (var i = 0; il = node.attributes.length; » i < il) newNode.setAttribute(node.attributes » .nodeName, node.getAttribute(node.attributes[i++] » .nodeName)); /* are we going after children too, and does » the node have any? */ if (allChildren && node.childNodes && » node.childNodes.length > 0) for (var i = 0; il = node.childNodes.length; » i < il) newNode.appendChild(document._importNode » (node.childNodes[i++], allChildren)); return newNode; break; case document.TEXT_NODE: case document.CDATA_SECTION_NODE: case document.COMMENT_NODE: return document.createTextNode(node.nodeValue); break; } };
- 38. http://www.google.com/trends/explore#q=jquery,mootools,dojo,yui,prototype&geo=IR
- 39. http://www.google.com/trends/explore#geo=IR-04&q=jquery,mootools,dojo,yui,prototype
- 42. AhmadBadpey@gmail.com www.1stwebdesigner.ir www.learningjquery.ir https://plus.google.com/106253854893238129636