|
|
|
@ -126,10 +126,7 @@ function getVersion(variable) {
|
|
|
|
|
<section> |
|
|
|
|
<div style='font-size:150%'> |
|
|
|
|
<pre><code class='javascript' data-trim> |
|
|
|
|
<script src='jquery.min.js'></script> |
|
|
|
|
<script> |
|
|
|
|
$.noConflict(); |
|
|
|
|
</script> |
|
|
|
|
$.noConflict(); |
|
|
|
|
</code></pre> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
@ -158,20 +155,20 @@ function getVersion(variable) {
|
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<pre><code class='javascript' data-trim> |
|
|
|
|
<p class='first'> |
|
|
|
|
$.fn.jquery: <span id='ex-1-1'></span> |
|
|
|
|
</p> |
|
|
|
|
<p class='first'> |
|
|
|
|
$.fn.jquery: <span id='ex-1-1'></span> |
|
|
|
|
</p> |
|
|
|
|
|
|
|
|
|
<p class='second'> |
|
|
|
|
jQuery.fn.jquery: <span id='ex-1-2'></span> |
|
|
|
|
</p> |
|
|
|
|
<p class='second'> |
|
|
|
|
jQuery.fn.jquery: <span id='ex-1-2'></span> |
|
|
|
|
</p> |
|
|
|
|
|
|
|
|
|
<script src='http://code.jquery.com/jquery-1.11.1.min.js'></script> |
|
|
|
|
<script>$.noConflict();</script> |
|
|
|
|
<script> |
|
|
|
|
<script src='http://code.jquery.com/jquery-1.11.1.min.js'></script> |
|
|
|
|
<script>$.noConflict();</script> |
|
|
|
|
<script> |
|
|
|
|
document.getElementById('ex-1-1').innerHTML = getVersion($); |
|
|
|
|
document.getElementById('ex-1-2').innerHTML = getVersion(jQuery); |
|
|
|
|
</script> |
|
|
|
|
</script> |
|
|
|
|
</code></pre> |
|
|
|
|
</section> |
|
|
|
|
|
|
|
|
@ -217,18 +214,18 @@ function getVersion(variable) {
|
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<pre><code class='html' data-trim> |
|
|
|
|
<p class='first'>$.fn.jquery: <span id='ex-2-1'></span></p> |
|
|
|
|
<p class='second'>jquery.fn.jquery: <span id='ex-2-2'></span></p> |
|
|
|
|
<p class='third'>novojQuery.fn.jquery: <span id='ex-2-3'></span></p> |
|
|
|
|
<p class='first'>$.fn.jquery: <span id='ex-2-1'></span></p> |
|
|
|
|
<p class='second'>jquery.fn.jquery: <span id='ex-2-2'></span></p> |
|
|
|
|
<p class='third'>novojQuery.fn.jquery: <span id='ex-2-3'></span></p> |
|
|
|
|
|
|
|
|
|
<script src='http://code.jquery.com/jquery-1.11.1.min.js'></script> |
|
|
|
|
<script src='http://code.jquery.com/jquery-2.1.1.min.js'></script> |
|
|
|
|
<script> |
|
|
|
|
<script src='http://code.jquery.com/jquery-1.11.1.min.js'></script> |
|
|
|
|
<script src='http://code.jquery.com/jquery-2.1.1.min.js'></script> |
|
|
|
|
<script> |
|
|
|
|
var novojQuery = $.noConflict(); |
|
|
|
|
document.getElementById('ex-2-1').innerHTML = getVersion($); |
|
|
|
|
document.getElementById('ex-2-2').innerHTML = getVersion(jQuery); |
|
|
|
|
document.getElementById('ex-2-3').innerHTML = getVersion(novojQuery); |
|
|
|
|
</script> |
|
|
|
|
</script> |
|
|
|
|
</code></pre> |
|
|
|
|
|
|
|
|
|
</section> |
|
|
|
@ -236,37 +233,80 @@ function getVersion(variable) {
|
|
|
|
|
<section> |
|
|
|
|
<div style='font-size:150%'> |
|
|
|
|
<pre><code class='javascript' data-trim> |
|
|
|
|
<script src='jquery.min.js'></script> |
|
|
|
|
<script src='http://code.jquery.com/jquery-1.11.1.min.js'></script> |
|
|
|
|
<script src='http://code.jquery.com/jquery-2.1.1.min.js'></script> |
|
|
|
|
<script> |
|
|
|
|
$.noConflict(); |
|
|
|
|
jQuery(document).ready(function ($) { |
|
|
|
|
// jQuery está disponível aqui como "$"; |
|
|
|
|
}); |
|
|
|
|
// outra biblioteca disponível como "$" aqui. |
|
|
|
|
$.noConflict(); |
|
|
|
|
(function ($) { |
|
|
|
|
// jQuery está disponível como "$" |
|
|
|
|
})(jQuery)); |
|
|
|
|
</script> |
|
|
|
|
</code></pre> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<ul> |
|
|
|
|
<li>jQuery aparece como "<code>$</code>" apenas |
|
|
|
|
dentro da função.</li> |
|
|
|
|
<ul> |
|
|
|
|
<li>Na verdade, cria uma função anônima que recebe |
|
|
|
|
o parâmetro "<code>$</code>" e chama esta função |
|
|
|
|
passando o jQuery.</li> |
|
|
|
|
<li>O resultado é que, dentro da função, o jQuery parece |
|
|
|
|
ser o mesmo velho jQuery de sempre.</li> |
|
|
|
|
</ul> |
|
|
|
|
</section> |
|
|
|
|
|
|
|
|
|
<section> |
|
|
|
|
<p class='first'>$.fn.jquery: <span id='ex-3-1'></span></p> |
|
|
|
|
<p class='second'>function ($): <span id='ex-3-2'></span></p> |
|
|
|
|
|
|
|
|
|
<script src='http://code.jquery.com/jquery-1.11.1.min.js'></script> |
|
|
|
|
<script src='http://code.jquery.com/jquery-2.1.1.min.js'></script> |
|
|
|
|
<script> |
|
|
|
|
$.noConflict(); |
|
|
|
|
(function ($) { |
|
|
|
|
document.getElementById('ex-3-2').innerHTML = getVersion($); |
|
|
|
|
})(jQuery); |
|
|
|
|
document.getElementById('ex-3-1').innerHTML = getVersion($); |
|
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
<p class='first'> |
|
|
|
|
$.fn.jquery: <script>document.write($.fn.jquery);</script> |
|
|
|
|
</p> |
|
|
|
|
|
|
|
|
|
<p class='second'> |
|
|
|
|
</p> |
|
|
|
|
<pre><code class='html' data-trim> |
|
|
|
|
<p class='first'>$.fn.jquery: <span id='ex-3-1'></span></p> |
|
|
|
|
<p class='second'>function ($): <span id='ex-3-2'></span></p> |
|
|
|
|
|
|
|
|
|
<pre><code class='javascript' data-trim> |
|
|
|
|
<script src='http://code.jquery.com/jquery-1.11.1.min.js'></script> |
|
|
|
|
<script src='http://code.jquery.com/jquery-2.1.1.min.js'></script> |
|
|
|
|
<script> |
|
|
|
|
$.noConflict(); |
|
|
|
|
(function ($) { |
|
|
|
|
document.getElementById('ex-3-2').innerHTML = getVersion($); |
|
|
|
|
})(jQuery); |
|
|
|
|
document.getElementById('ex-3-1').innerHTML = getVersion($); |
|
|
|
|
</script> |
|
|
|
|
</code></pre> |
|
|
|
|
</section> |
|
|
|
|
|
|
|
|
|
<section> |
|
|
|
|
<div style='font-size:150%'> |
|
|
|
|
<pre><code class='javascript' data-trim> |
|
|
|
|
<script src='http://code.jquery.com/jquery-1.11.1.min.js'></script> |
|
|
|
|
<script src='http://code.jquery.com/jquery-2.1.1.min.js'></script> |
|
|
|
|
<script> |
|
|
|
|
$.noConflict(); |
|
|
|
|
jQuery(document).ready(function ($) { |
|
|
|
|
// jQuery está disponível aqui como "$"; |
|
|
|
|
}); |
|
|
|
|
// outra biblioteca disponível como "$" aqui. |
|
|
|
|
</script> |
|
|
|
|
</code></pre> |
|
|
|
|
</div> |
|
|
|
|
|
|
|
|
|
<ul> |
|
|
|
|
<li>jQuery aparece como "<code>$</code>" apenas |
|
|
|
|
dentro da função.</li> |
|
|
|
|
</ul> |
|
|
|
|
</section> |
|
|
|
|
</section> |
|
|
|
|
|
|
|
|
|
<section data-background='_images/thats-all-folks.jpg'> |
|
|
|
|
<section></section> |
|
|
|
|
</section> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|