Home > Developer > JavaScript
Jquery experience and jquery experience
1. Today, we found that the dom object obtained by jquery can access the original object in addition to the jquery object. You only need to add a [] object. This function is available in the past, I did not study it carefully before.
2. first-child and nth-child (n) are used to obtain the first element in the element set.
3. Use Jquery to access the nodeText node. Use nextSibling to access the original object. The access is nextSibling. nodeValue;
<!DOCTYPE HTML>4. DOM object and jQuery object Conversion
The code for getting a DOM object is as follows:
// Obtain the DOM object var div1 = document. getElementById ("div1"); div1.innerHTML = "oec2003 ";The code for getting a jQuery object is as follows:
// Obtain the jQuery object var div1 =v1 ("# div1" );div1.html ("oec2003 ");Convert jQuery object to DOM object
// Because the ajQuery object is an array object, you must use the index form var $ div1 =$ ("# div1") to convert it to a DOM object "); // jQuery object var div1 = $ div1 [0]; // convert to DOM object var div2 = $ div1.get (0 ); // the same effect as the previous line: div1.innerHTML = "oec2003 ";Convert a DOM object to a jQuery object
// Convert the DOM object to jQuery. You only need to wrap it with $ to var div1 = document. getElementById ("div1"); var $ div1 =$ (div1); // converts it to the jqueryobject_nvidiv1.html ("oec2003 ");5. Conflict Resolution
Sometimes, when jQuery is used together with other libraries or some public script files written by itself, the $ conflict may occur. There are two solutions to the conflict:
1. The jQuery library is referenced after other libraries, as shown below:
Copy codeThe Code is as follows:
<Script type = "text/javascript" src = "Scripts/jquery-1.8.1.min.js"> </script>
<Script type = "text/javascript" src = "Scripts/common. js"> </script>
The code for redefining $ in common. js is as follows:function $(id) { return document.getElementById(id);}The following code resolves conflicts in jQuery:
// Method 1jQuery. noConflict (); // hand over the control of $. jQueryjQuery (document) is used in all previously $ fields ). ready (function () {alert (jQuery ("# span1" ).html () ;}); window. onload = function () {$ ("span1 "). innerHTML = "oec2003";} // method 2var $ j = jQuery. noConflict (); // defines the shortcut $ j (document ). ready (function () {alert ($ j ("# span1" pai.html () ;}); window. onload = function () {$ ("span1 "). innerHTML = "oec2003";} // method 3jQuery. noConflict (); // continue using $ jQuery (function ($) {alert ($ ("# span1" ).html ();}) within the function; window. onload = function () {$ ("span1 "). innerHTML = "oec2003";} // method 4jQuery. noConflict (); // inside the function, continue using $ another method (function ($) {$ (function () {alert ($ ("# span1" ).html () ;}) ;}( jQuery); window. onload = function () {$ ("span1 "). innerHTML = "oec2003 ";}2. The jQuery library is used before other libraries.
// If you reference the jQuery script first, you do not need to use noConflict // jQuery. noConflict (); jQuery (document ). ready (function () {alert (jQuery ("# span1" ).html () ;}); window. onload = function () {$ ("span1 "). innerHTML = "oec2003 ";}The above is all the content shared in this article. I hope you will like it.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
