Style ändern#

    function findStyle(selectorText) {
      for (var i = 0; i < document.styleSheets.length; ++i) {
        var styleSheet = document.styleSheets[i];
        var css = styleSheet.cssRules || styleSheet.rules;
        for (var j = 0; j < css.length; ++j) {
          var rule = css[j];
          if (rule.selectorText == selectorText)
            return rule.style;
        }
      }
    }

Die Funktion kann dann wie folgt verwendet werden:

findStyle('.test').width = '100px';

Events#

Events aus Mozilla und IE bekommt man mit "event || window.event":

<input onkeypress="alert((event || window.event).keyCode);">

Focus und Keypress#

Normale Elemente bekommen Key-Events nur mit, wenn sie einen Tabindex und den Focus haben:

<div tabindex="0" onkeypress="alert((event || window.event).keyCode);" onmouseover="focus();" onmouseout="blur();">
  TEST
</div>

Dynamische Header#

Folgender Code fügt neue Header ein:

function addHeader(text) {
	var head = document.getElementsByTagName("head")[0];
	var div = document.createElement('div');
	div.innerHTML = text;
	for (var i = 0; i < div.childNodes.length; ++i) {
		var element = document.createElement(div.childNodes[i].nodeName);
		element.innerHTML = div.childNodes[i].innerHTML;
		for (var j = 0; j < div.childNodes[i].attributes.length; ++j) {
			element.setAttribute(
				div.childNodes[i].attributes[j].name, div.childNodes[i].attributes[j].value);
		}
		head.appendChild(element);
	}
}

Property Interceptor#

Mit Object.defineProperty kann man einen Interceptor für Getter und Setter einfügen:

	var scrollTop = Object.getOwnPropertyDescriptor(Object.getPrototypeOf(HTMLElement.prototype), "scrollTop");
	Object.defineProperty(HTMLElement.prototype, "scrollTop", {
		get: function() {
			return scrollTop.get.apply(this, arguments);
		},
		set: function() {
			return scrollTop.set.apply(this, arguments);
		}
	});

Lambda Function#

Mit dieser Funktion können anonyme, rekursive Funktionen definiert werden:

var Y = function(f) {
	return (function(g) {
		return g(g);
	})(function(h) {
		return function() {
			return f.apply(h(h), arguments);
		};
	});
};

Eine rekursive Funktion sieht dann wie folgt aus (Fakultät, aufgerufen mit Wert 5):

Y(function(n) {return n == 0 ? 1 : n * this(n - 1);})(5);

Links#

• Funktionen