Zusammenfassung der Erfahrungen mit jquery

Zusammenfassung der Erfahrungen mit jquery_jquery

WBOY

Freigeben： 2016-05-16 15:58:27

Original

1072 Leute haben es durchsucht

1. Heute habe ich festgestellt, dass das von jquery erhaltene dom-Objekt auch auf das ursprüngliche Objekt zugreifen kann, aber ich habe es nicht getan Studieren Sie es vorher sorgfältig.

2, verwenden Sie das erste Kind und das n-te Kind (n), um das erste Element im Elementsatz abzurufen.

3. Verwenden Sie JQuery, um auf den NodeText-Knoten zuzugreifen, indem Sie auf das Originalobjekt und nextSibling zugreifen. Der Zugriff ist nextSibling.nodeValue;

<!DOCTYPE HTML>
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
  <title>Zephyr's Document</title>
  <script src="http://common.cnblogs.com/script/jquery.js"></script>
  <style type="text/css" media="screen">
  /*<![CDATA[*/
 
  /*]]>*/
  </style>
  <script type="text/javascript">
  $(function(){
  var tempBr=$("br");
  tempBr.each(function(index,doElem){
    doElem.nextSibling.nodeValue=doElem.nextSibling.nodeValue.replace(/\s{6}/g,"");
  })})
  </script>
  </head>
  <body>
  asdf
    <br />
    "   asdf"
    <br />
    "   asdf"
    <br />
    "   asdf"
  </body>
</html>

Nach dem Login kopieren

Konvertierung von 4.DOM-Objekten und jQuery-Objekten

Der Code zum Abrufen des DOM-Objekts lautet wie folgt:

//获取DOM对象
var div1 = document.getElementById("div1");
div1.innerHTML = "oec2003";

Nach dem Login kopieren

Der Code zum Abrufen des jQuery-Objekts lautet wie folgt:

//获取jQuery对象
var div1 = $("#div1");
div1.html("oec2003");

Nach dem Login kopieren

jQuery-Objekt zu DOM-Objekt

//因为ajQuery对象是一个数组对象，所以转换为DOM对象时要用索引的形式
var $div1 = $("#div1"); //jQuery对象
var div1 = $div1[0]; //转换为了DOM对象
var div2 = $div1.get(0); //和上面一行效果一样
div1.innerHTML = "oec2003";

Nach dem Login kopieren

DOM-Objekt zu jQuery-Objekt

//DOM对象转jQuery只需用$包装即可
var div1 = document.getElementById("div1");
var $div1 = $(div1); //转换为了jQuery对象
$div1.html("oec2003");

Nach dem Login kopieren

5. Konflikte lösen

Manchmal gibt es Szenarien, in denen jQuery zusammen mit anderen Bibliotheken oder einigen von Ihnen selbst geschriebenen öffentlichen Skriptdateien verwendet wird, und es kann ein $-Konfliktproblem vorliegen. Es gibt zwei Situationen, um den Konflikt zu lösen:

1. Auf die jQuery-Bibliothek wird nach anderen Bibliotheken verwiesen, wie unten gezeigt:

Code kopieren Der Code lautet wie folgt:

Es gibt eine Neudefinition von $ in common.js, der Code lautet wie folgt:

function $(id) {

  return document.getElementById(id);
}

Nach dem Login kopieren

Im Folgenden finden Sie den Code zum Lösen von Konflikten in jQuery. Es gibt vier Möglichkeiten:

//方式1
jQuery.noConflict(); //将$控制权移交出去，以前使用$的地方都改用jQuery
jQuery(document).ready(function () {
  alert(jQuery("#span1").html());
});
window.onload = function () {
  $("span1").innerHTML = "oec2003";
}

//方式2
var $j=jQuery.noConflict(); //定义快捷方式
$j(document).ready(function () {
  alert($j("#span1").html());
});

window.onload = function () {
  $("span1").innerHTML = "oec2003";
}

//方式3
jQuery.noConflict(); //在函数内部继续使用$
jQuery(function ($) {
  alert($("#span1").html());
});
window.onload = function () {
  $("span1").innerHTML = "oec2003";
}

//方式4
jQuery.noConflict(); //在函数内部继续使用$另一种方式
(function ($) {
  $(function(){
    alert($("#span1").html());
  });
})(jQuery);
window.onload = function () {
  $("span1").innerHTML = "oec2003";
}

Nach dem Login kopieren

2. Verwenden Sie die jQuery-Bibliothek vor anderen Bibliotheken

//如果先引用jQuery脚本，可以不使用noConflict
//jQuery.noConflict(); 
jQuery(document).ready(function () {
  alert(jQuery("#span1").html());
});
window.onload = function () {
  $("span1").innerHTML = "oec2003";
}

Nach dem Login kopieren

Das Obige ist der gesamte Inhalt, der in diesem Artikel mit Ihnen geteilt wird. Ich hoffe, dass er Ihnen gefällt.