Heim > Web-Frontend > js-Tutorial > Hauptteil

Eine Sammlung häufig verwendeter JavaScript-Methoden und -Funktionen, die ich teilen muss (Teil 2)_Javascript-Kenntnisse

WBOY
Freigeben: 2016-05-16 15:23:25
Original
1211 Leute haben es durchsucht

In diesem Artikel haben wir einige häufig verwendete Javascript-Funktionen zusammengestellt, in der Hoffnung, Freunden, die JS lernen, hilfreich zu sein.

22. Elemente ersetzen

$(document).ready(function() {
  $('#id').replaceWith('
<DIV>I have been replaced</DIV>
 
');
});
Nach dem Login kopieren

23. jQuery-Funktion zum verzögerten Laden

$(document).ready(function() {
  window.setTimeout(function() {
    // do something
  }, 1000);
});
Nach dem Login kopieren

24. Wortfunktion entfernen

$(document).ready(function() {
  var el = $('#id');
  el.html(el.html().replace(/word/ig, ""));
});
Nach dem Login kopieren

25. Überprüfen Sie, ob das Element in der JQuery-Objektsammlung vorhanden ist

$(document).ready(function() {
  if ($('#id').length) {
   // do something
 }
});
Nach dem Login kopieren

26. Machen Sie das gesamte DIV anklickbar

$(document).ready(function() {
  $("div").click(function(){
     //get the url from href attribute and launch the url
   window.location=$(this).find("a").attr("href"); return false;
  });// how to use<DIV><A href="index.html">home</A></DIV>});
Nach dem Login kopieren

27. Umrechnung zwischen ID und Klasse
Wechseln Sie beim Ändern der Fenstergröße zwischen ID und Klasse

$(document).ready(function() {
  function checkWindowSize() {
    if ( $(window).width() > 1200 ) {
    $('body').addClass('large');
  }  else {
    $('body').removeClass('large');
  }
  }
$(window).resize(checkWindowSize);
});
Nach dem Login kopieren

28. Objekt klonen

$(document).ready(function() {
  var cloned = $('#id').clone();// how to use<DIV id=id></DIV>});
Nach dem Login kopieren

29. Positionieren Sie das Element in der Mitte des Bildschirms

$(document).ready(function() {
 jQuery.fn.center = function () {
    this.css("position","absolute");
       this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
          this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
             return this;
 }
 $("#id").center();
});
Nach dem Login kopieren

30. Schreiben Sie Ihren eigenen Selektor

$(document).ready(function() {
  $.extend($.expr[':'], {
    moreThen1000px: function(a) {
         return $(a).width() > 1000;
   }
  });
 $('.box:moreThen1000px').click(function() {
    // creating a simple js alert box
   alert('The element that you have clicked is over 1000 pixels wide');
 });
});
Nach dem Login kopieren

31. Zählen Sie die Anzahl der Elemente

$(document).ready(function() {
  $("p").size();
});
Nach dem Login kopieren

32. Verwenden Sie Ihre eigenen Kugeln

$(document).ready(function() {
  $("ul").addClass("Replaced");
  $("ul > li").prepend("&#8210; "); // how to use
 ul.Replaced { list-style : none; }
});
Nach dem Login kopieren

33. Verweisen Sie auf die Jquery-Klassenbibliothek auf dem Google-Host

//Example 1
<SCRIPT src="http://www.google.com/jsapi"></SCRIPT>
<SCRIPT type=text/javascript>
google.load("jquery", "1.2.6");
google.setOnLoadCallback(function() {
  // do something
});
</SCRIPT><SCRIPT type=text/javascript src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></SCRIPT>
 // Example 2:(the best and fastest way)
<SCRIPT type=text/javascript src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></SCRIPT>
Nach dem Login kopieren

34. Deaktivieren Sie den JQuery-Effekt (Animation)

$(document).ready(function() {
  jQuery.fx.off = true;
});
Nach dem Login kopieren

35. Lösung für Konflikte mit anderen Javascript-Bibliotheken

$(document).ready(function() {
  var $jq = jQuery.noConflict();
  $jq('#id').show();
});
Nach dem Login kopieren

Das Obige ist der gesamte Inhalt dieses Artikels. Wenn es Ihnen gefällt, sammeln Sie es einfach!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage