Kategorie: JavaScript

ShareMySnippets Plugin für Eclipse

Das ShareMySnippets-Plugin ist eine Erweiterung für Eclipse mit der sich Code-Snippets von Share-My-Snippets.de direkt in die IDE einfügen lassen. Über ein Suchfeld können alle öffentlichen Snippets nach den entsprechenden Begriffen durchsucht werden.

Snippets einfügen:
Über den Menü-Punkt „Share My Snippets > Browse Snippets“ können die Snippets eingefügt werden:
Snippet einfügen
ShareMySnippets Plugin für Eclipse weiterlesen

jQuery Quick-Cache (inkl. Benchmark)

Sobald das DOM etwas umfangreicher ist, sollten so viele jQuery-Objekte wie möglich gecached werden. Da sonst Performance-Problemen im JavaScript-Code auftreten können. Der nachfolgende Code zeigt, wie ein einfacher Caching-Mechanismus für jQuery umgesetzt werden kann.

Code:

var oCache = {};

function $$(sSelector)
{
  if(!oCache.hasOwnProperty(sSelector))
  oCache[sSelector] = $(sSelector);
  return oCache[sSelector];
};

jQuery Quick-Cache (inkl. Benchmark) weiterlesen

htmlentities in JavaScript

Diese JavaScript-Methode gibt einen String mit HTML-Entities zurück. Über das Objekt „oEntities“ können bei Bedarf weitere Entities ergänzt werden.

Code:

function htmlentities(sInput)
{
    var oEntities = {'&': '&amp;', '<': '&lt;', '>': '&gt;'};
    return sInput.replace(/[&<>]/g, function(sString){return oEntities[sString] || sString});
}

Browser Fingerprinting mit JavaScript

Diese JavaScript-Funktion erzeugt eine nahezu eindeutige Kennung von einem Webbrowser. Über fest im Browser eingestellte Parameter (z.B. Installierte Plugins, Auflösung, usw.) kann so ein Benutzer mit einer hohen Warscheinlichkeit eindeutig identifiziert werden. Das Ganze ist mit sehr geringem Programmieraufwand realisierbar.

Code:

<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
<script src="https://raw.github.com/placemarker/jQuery-MD5/master/jquery.md5.js" type="text/javascript"></script>
<script type="text/javascript">

function getBrowserFingerprint()
{
    var sFP = "";
    sFP+="Resolution:"+window.screen.availWidth+"x"+window.screen.availHeight+"\n";
    sFP+="ColorDepth:"+screen.colorDepth+"\n";
    sFP+="UserAgent:"+navigator.userAgent+"\n";    
    sFP+="Timezone:"+(new Date()).getTimezoneOffset()+"\n";
    sFP+="Language:"+(navigator.language || navigator.userLanguage)+"\n";
    document.cookie="sFP";
    if (typeof navigator.cookieEnabled != "undefined"
        && navigator.cookieEnabled == true
        && document.cookie.indexOf("sFP") != -1)
    sFP+="Cookies:true\n";
    else
    sFP+="Cookies:false\n"
    sFP+="Plugins:"+jQuery.map(navigator.plugins, function(oElement)
                                                  {
                                                    return "\n"+oElement.name+"-"+oElement.version;
                                                  });
    return $.md5(sFP);
}

alert(getBrowserFingerprint()); //d36fd202c2ab01a371c54b72b0e8e3c0

</script>

Verwendete Bibliotheken & Plugins:

Demo: jsFiddle

Verzögertes „onmouseover“-Event mit jQuery

Manchmal kommt es vor, dass eine Aktion nicht direkt ausgeführt werden soll, sondern leicht verzögert. Beispielsweise möchte man einen Tooltip realisieren, der erst eingeblendet wird, wenn die Maus einige Zeit über das entsprechende Element gehalten wird. Hier kann dieser Code-Schnippsel behilflich sein.

$("#myTarget").mouseover(function()
{
    $("#myTarget").addClass("active");
    setTimeout(function()
    {
        if($("#myTarget").hasClass("active"))
        alert("Verzoegert");
    }, 1000);
});

$("#myTarget").mouseleave(function()
{
    $("#myTarget").removeClass("active");
});