MySQL: Zahl in Datum umwandeln

Falls jemand mal z.B. einen Int-Wert in ein Datum umwandeln muss, kann “CONVERT” bzw. “CAST” weiterhelfen. Auch wenn man eigentlich die Datenbank im Vorhinein so gestalten sollte, dass “date” / “datetime” / … / als Datentyp verwendet wird. ;)

 

Beispiel-Datenbank:

CREATE TABLE `lall` (
`Id` int(11) NOT NULL AUTO_INCREMENT,
`IntDate` int(11) NOT NULL DEFAULT '0',
PRIMARY KEY (`Id`)
) ENGINE=MyISAM DEFAULT CHARSET=utf8;

INSERT INTO `lall` VALUES (1,201001);
INSERT INTO `lall` VALUES (2,201002);
INSERT INTO `lall` VALUES (3,201003);
INSERT INTO `lall` VALUES (4,0);
INSERT INTO `lall` VALUES (5,201011);
INSERT INTO `lall` VALUES (6,201012);
INSERT INTO `lall` VALUES (7,201205);

SQL:

SELECT * FROM lall
WHERE ((CONVERT(CONCAT(IntDate, '01'), datetime))>NOW() - INTERVAL 12 MONTH OR IntDate=0)

< – dieses SELECT-Statement zeigt alle Datensätze an, welche nicht älter als 12 Monate sind oder als (int) Datum “0” eingetragen haben.

CONVERT -> http://dev.mysql.com/doc/refman/5.1/de/charset-convert.html
CONCAT -> http://dev.mysql.com/doc/refman/5.1/de/string-functions.html#id571625
NOW -> http://dev.mysql.com/doc/refman/5.1/de/date-and-time-functions.html#id586485

Cross-Compiling Android Kernel – Samsung GalaxyS2

Das GalaxyS2 läuft ziemlich gut mit dem neuen nightly-builds von CM9 (Android 4.0.4) & den neusten Google-Apps & dem SiyahKernel.

Ich möchte hier kurz erklären, wie du einen Kernel für das Samsung S2 (CM9) auf Basis vom SiyahKernel kompilierst. :) 

 

1.) Installiere Linux + Cross-Compiler 

Als erstes solltest du Linux bereits installiert haben (z.B. Ubuntu, Debian …) ggf. einfach auf einen virtuellen PC z.B. via VirtualBox. Für Ubuntu gibt es bereits ab Werk GCC für ARM, bei Debian habe ich bisher folgende Paket-Quellen ( /etc/apt/sources.list ) mit aufgenommen und anschließend gcc-4.6-arm installiert, jedoch bisher nur mit Debian *sid* getestet.

deb http://www.emdebian.org/debian/ unstable main

Install:

sudo apt-get install build-essential git gcc-4.5-arm-linux-gnueabi wget libncurses5-dev

 

2.) Download der Quellen via github

Fork via github die Quellen welche du kompilieren möchtest und lade deine eigenen “Sources” herunter, um später ggf. “Pull Requests” zu stellen. Daher musst du bei den folgenden Befehlen “voku” durch deinen eigenen User-Namen bei github ersetzen.

 mkdir -p ~/sgs2/kernel/

cd ~/sgs2/kernel/

git clone https://github.com/voku/siyahkernel3

git clone https://github.com/voku/initramfs3

PS: “~” (tilde) = home-Verzeichnis -> info

Falls du nun einen anderen Cross-Compiler installiert hast als ich, musst du in der Datei (build_kernel.sh) die CROSS_COMPILE Variable anpassen. (whereis – locate the binary, source, and manual page files for a command)

cd ~/sgs2/kernel/siyahkernel3

./build_kernel.sh

 

Sobald der Kernel kompiliert wurde findest du folgende Datei “zImage”, welche wiederum der Kernel selber ist. ;)

 

PS: hier meine Version kompiliert mit gcc-4.6 & -Ofast & neuem Tweak-Script ->  http://samdroid.voku-online.de/index.php?action=list&dir=SGS2&order=name&srt=yes

 

Tipps: 

– CyanogenMod 9 Flashen -> AOSP 4.0.4 Cyanogen (mod) 9 Flash Anleitung

– keine Angst vor git -> man braucht meistens nur ein paar Befehle -> “git pull” & “git  push” & “git add –all” 

– git? -> http://rogerdudler.github.com/git-guide/index.de.html 

– Kernel-Config -> ~/sgs2/kernel/siyahkernel3/arch/arm/configs/siyah_defconfig 

– Tweak Skript ->  ~/sgs2/kernel/initramfs3/sbin/ext/thunderbolt.sh

– Makefile ->  ~/sgs2/kernel/siyahkernel3/Makefile 

C-Programm & Cflags

Ich habe vor einiger Zeit das Prinzip von Makefiles anhand eines kleines Beispiels gezeigt -> http://suckup.de/howto/c/c-programm-primzahlen-makefiles/ <- den selben Quelltext kompilieren wir heute mit verschiedenen C-Flags und 1000000 Schleifendurchläufen …

 

1.)  ohne C-Flags

gcc -lm primzahlen.c -o primzahlen_slow

 

Output: time ./primzahlen_slow

[...]

999961
999979
999983

real 0m1.760s
user 0m1.420s
sys 0m0.164s

 

2.)  ohne C-Flags & ohne “math.h” (sqrt)

gcc primzahlen.c -o primzahlen_slow

 

Output: time ./primzahlen_slow

[...]

999961
999979
999983

real 0m1.407s
user 0m0.988s
sys 0m0.192s

 

3.)  -O2 & ohne “math.h” (sqrt)

gcc -O2 primzahlen.c -o primzahlen_2

 

Output: time ./primzahlen_slow

[...]

999961
999979
999983

real 0m1.405s
user 0m0.976s
sys 0m0.188s

 

4.) -Ofast (http://gcc.gnu.org/gcc-4.6/changes.html) & ohne “math.h” (sqrt)

gcc -Ofast primzahlen.c -o primzahlen_fast

 

Output: time ./primzahlen_fast

[...]

999961
999979
999983

real 0m1.377s
user 0m0.980s
sys 0m0.180s

 

5.) -Ofast + amdfam10 (http://en.gentoo-wiki.com/wiki/Safe_Cflags/AMD#Athlon_X2_7x50.2C_Phenom_X3.2FX4.2C_Phenom_II.2C_Athlon_II_X2.2FX3.2FX4

Ein paar spezielle CFlags für meine CPU. :) (cat /proc/cpuinfo)

gcc -Ofast -funsafe-math-optimizations -funsafe-loop-optimizations -m64 -mtune=amdfam10 -mabm -msse4a -floop-parallelize-all -ftree-parallelize-loops=4 -floop-strip-mine -floop-block -funroll-all-loops -fbranch-target-load-optimize -lm primzahlen.c -o primzahlen_fast

 

Output: time ./primzahlen_fast

[...]

999961
999979
999983

real 0m1.327s
user 0m0.944s
sys 0m0.172s

 

Fazit: 

Sobald ich -O1, -O2, -O3 oder -Ofast bei diesem kleinen Beispiel nutze ist der Geschwindigkeitsunterschied minimal und es ist egal, ob vorgefertigte mathematische Funktionen genutzt werden oder nicht.

PHP-Sicherheit erhöhen – Teil 1

 Jeder Server welcher PHP-Skripte verarbeitet, sollte zumindest zwei Sicherheitsschlösser eingebaut haben, so dass man nicht jedem Tür & Tor öffnet. 

 

1.) suPHP oder suexec + fcgid

Wir sollten PHP-Skript nicht alle mit dem selben User-Berechtigungen (z.B. apache) laufen lassen, daher empfiehlt es sich auf kleinen Webservern suPHP und auf Webseiten mit mehr Traffic “Fast CGI” zu installieren. Alternativ kann man PHP mit “PHP-FPM” (FastCGI Process Manager) auch jeweils als eigenständigen Prozess laufen lassen. 

2.) Suhosin

Da einige PHP-Projekte nicht wirklich für Ihre Sicherheit bekannt sind, empfiehlt es sich zudem die “Suhosin” Erweiterung für PHP zu installieren. “Es wurde entworfen, um den Server und die Benutzer vor bekannten und unbekannten Fehlern in PHP-Anwendungen und im PHP-Kern zu schützen.” – Wiki

PS: auf der Webseite -> http://www.dotdeb.org <- findet man einfach zu installierende .deb-Pakete für Debian / Ubuntu in welchen die Suhosin-Erweiterung bereits integriert ist und liegt zudem als “php5-fpm” Version zur Verfügung. ;) 

 

mehr Sicherheit:

Mod-Security und Apache

Mod-Spamhaus und Apache

– WordPress Sicherheit erhöhen

– php.ini / php.net

www.howtoforge.com | viele gute HowTo’s 

Monatsnamen / Wochentagsnamen in deutsch via PHP

“Gibt einen String zurück, der den angegebenen Formatierungs-Merkmalen entspricht. Dabei wird der gegebene Timestamp/ Zeitstempel oder – falls dieser fehlt – die momentane lokale Zeit benutzt. Der Monats- und Wochentagsname wird entsprechend des per setlocale() eingestellten Wertes gesetzt.” – php.net/manual/de/function.strftime.php

 

setlocale(LC_TIME, "de_DE");
echo strftime("%A"); // Wochentagsname
echo strftime("%B"); // Monatsname

perror – Explain Error Codes für MySQL in der Shell

for i in `seq 1 180`; do perror ${i}; done | less

Info: http://dev.mysql.com/doc/refman/5.0/en/perror.html

 

Ausgabe:

OS error code   1:  Operation not permitted
OS error code   2:  No such file or directory
OS error code   3:  No such process
OS error code   4:  Interrupted system call
OS error code   5:  Input/output error
OS error code   6:  No such device or address
OS error code   7:  Argument list too long
OS error code   8:  Exec format error
OS error code   9:  Bad file descriptor
OS error code  10:  No child processes
OS error code  11:  Resource temporarily unavailable
OS error code  12:  Cannot allocate memory
OS error code  13:  Permission denied
OS error code  14:  Bad address
OS error code  15:  Block device required
OS error code  16:  Device or resource busy
OS error code  17:  File exists
OS error code  18:  Invalid cross-device link
OS error code  19:  No such device
OS error code  20:  Not a directory
OS error code  21:  Is a directory
OS error code  22:  Invalid argument
OS error code  23:  Too many open files in system
OS error code  24:  Too many open files
OS error code  25:  Inappropriate ioctl for device
OS error code  26:  Text file busy
OS error code  27:  File too large
OS error code  28:  No space left on device
OS error code  29:  Illegal seek
OS error code  30:  Read-only file system
OS error code  31:  Too many links
OS error code  32:  Broken pipe
OS error code  33:  Numerical argument out of domain
OS error code  34:  Numerical result out of range
OS error code  35:  Resource deadlock avoided
OS error code  36:  File name too long
OS error code  37:  No locks available
OS error code  38:  Function not implemented
OS error code  39:  Directory not empty
OS error code  40:  Too many levels of symbolic links
OS error code  42:  No message of desired type
OS error code  43:  Identifier removed
OS error code  44:  Channel number out of range
OS error code  45:  Level 2 not synchronized
OS error code  46:  Level 3 halted
OS error code  47:  Level 3 reset
OS error code  48:  Link number out of range
OS error code  49:  Protocol driver not attached
OS error code  50:  No CSI structure available
OS error code  51:  Level 2 halted
OS error code  52:  Invalid exchange
OS error code  53:  Invalid request descriptor
OS error code  54:  Exchange full
OS error code  55:  No anode
OS error code  56:  Invalid request code
OS error code  57:  Invalid slot
OS error code  59:  Bad font file format
OS error code  60:  Device not a stream
OS error code  61:  No data available
OS error code  62:  Timer expired
OS error code  63:  Out of streams resources
OS error code  64:  Machine is not on the network
OS error code  65:  Package not installed
OS error code  66:  Object is remote
OS error code  67:  Link has been severed
OS error code  68:  Advertise error
OS error code  69:  Srmount error
OS error code  70:  Communication error on send
OS error code  71:  Protocol error
OS error code  72:  Multihop attempted
OS error code  73:  RFS specific error
OS error code  74:  Bad message
OS error code  75:  Value too large for defined data type
OS error code  76:  Name not unique on network
OS error code  77:  File descriptor in bad state
OS error code  78:  Remote address changed
OS error code  79:  Can not access a needed shared library
OS error code  80:  Accessing a corrupted shared library
OS error code  81:  .lib section in a.out corrupted
OS error code  82:  Attempting to link in too many shared libraries
OS error code  83:  Cannot exec a shared library directly
OS error code  84:  Invalid or incomplete multibyte or wide character
OS error code  85:  Interrupted system call should be restarted
OS error code  86:  Streams pipe error
OS error code  87:  Too many users
OS error code  88:  Socket operation on non-socket
OS error code  89:  Destination address required
OS error code  90:  Message too long
OS error code  91:  Protocol wrong type for socket
OS error code  92:  Protocol not available
OS error code  93:  Protocol not supported
OS error code  94:  Socket type not supported
OS error code  95:  Operation not supported
OS error code  96:  Protocol family not supported
OS error code  97:  Address family not supported by protocol
OS error code  98:  Address already in use
OS error code  99:  Cannot assign requested address
OS error code 100:  Network is down
OS error code 101:  Network is unreachable
OS error code 102:  Network dropped connection on reset
OS error code 103:  Software caused connection abort
OS error code 104:  Connection reset by peer
OS error code 105:  No buffer space available
OS error code 106:  Transport endpoint is already connected
OS error code 107:  Transport endpoint is not connected
OS error code 108:  Cannot send after transport endpoint shutdown
OS error code 109:  Too many references: cannot splice
OS error code 110:  Connection timed out
OS error code 111:  Connection refused
OS error code 112:  Host is down
OS error code 113:  No route to host
OS error code 114:  Operation already in progress
OS error code 115:  Operation now in progress
OS error code 116:  Stale NFS file handle
OS error code 117:  Structure needs cleaning
OS error code 118:  Not a XENIX named type file
OS error code 119:  No XENIX semaphores available
OS error code 120:  Is a named type file
MySQL error code 120: Didn't find key on read or update
OS error code 121:  Remote I/O error
MySQL error code 121: Duplicate key on write or update
OS error code 122:  Disk quota exceeded
OS error code 123:  No medium found
MySQL error code 123: Someone has changed the row since it was read (while the table was locked to prevent it)
OS error code 124:  Wrong medium type
MySQL error code 124: Wrong index given to function
OS error code 125:  Operation canceled
MySQL error code 125: Undefined handler error 125
OS error code 126:  Required key not available
MySQL error code 126: Index file is crashed
OS error code 127:  Key has expired
MySQL error code 127: Record file is crashed
OS error code 128:  Key has been revoked
MySQL error code 128: Out of memory in engine
OS error code 129:  Key was rejected by service
MySQL error code 129: Undefined handler error 129
OS error code 130:  Owner died
MySQL error code 130: Incorrect file format
OS error code 131:  State not recoverable
MySQL error code 131: Command not supported by database
MySQL error code 132: Old database file
MySQL error code 133: No record read before update
MySQL error code 134: Record was already deleted (or record file crashed)
MySQL error code 135: No more room in record file
MySQL error code 136: No more room in index file
MySQL error code 137: No more records (read after end of file)
MySQL error code 138: Unsupported extension used for table
MySQL error code 139: Too big row
MySQL error code 140: Wrong create options
MySQL error code 141: Duplicate unique key or constraint on write or update
MySQL error code 142: Unknown character set used in table
MySQL error code 143: Conflicting table definitions in sub-tables of MERGE table
MySQL error code 144: Table is crashed and last repair failed
MySQL error code 145: Table was marked as crashed and should be repaired
MySQL error code 146: Lock timed out; Retry transaction
MySQL error code 147: Lock table is full;  Restart program with a larger locktable
MySQL error code 148: Updates are not allowed under a read only transactions
MySQL error code 149: Lock deadlock; Retry transaction
MySQL error code 150: Foreign key constraint is incorrectly formed
MySQL error code 151: Cannot add a child row
MySQL error code 152: Cannot delete a parent row
MySQL error code 153: No savepoint with that name
MySQL error code 154: Non unique key block size
MySQL error code 155: The table does not exist in engine
MySQL error code 156: The table already existed in storage engine
MySQL error code 157: Could not connect to storage engine
MySQL error code 158: Unexpected null pointer found when using spatial index
MySQL error code 159: The table changed in storage engine
MySQL error code 160: There's no partition in table for the given value
MySQL error code 161: Row-based binlogging of row failed
MySQL error code 162: Index needed in foreign key constraint
MySQL error code 163: Upholding foreign key constraints would lead to a duplicate key error in some other table
MySQL error code 164: Table needs to be upgraded before it can be used
MySQL error code 165: Table is read only
MySQL error code 166: Failed to get next auto increment value
MySQL error code 167: Failed to set row auto increment value
MySQL error code 168: Unknown (generic) error from engine
MySQL error code 169: Record is the same
MySQL error code 170: It is not possible to log this statement
MySQL error code 171: The event was corrupt, leading to illegal data being read
MySQL error code 172: The table is of a new format not supported by this version
MySQL error code 173: The event could not be processed no other hanlder error happened
MySQL error code 174: Got a fatal error during initialzaction of handler
MySQL error code 175: File to short; Expected more data in file
MySQL error code 176: Read page with wrong checksum
MySQL error code 177: Too many active concurrent transactions
MySQL error code 178: Index column length exceeds limit
MySQL error code 179: Index corrupted
MySQL error code 180: Undo record too big

C-Programm – einfacher Taschenrechner

Hier mal wieder ein einfaches Beispiel in C mit “Struktogramm” & “Programmablaufplan” & “Pseudocode” …

 

Pseudocode:

begin
    Eine 'einfache' Rechenaufgabe (z.B. 5+5) eingeben.
    Aufteilung der Eingabe in (drei) Variablen [ein1, ein2, ein3]
    case ein2 is
        +: Addition: "ein1" & "ein3"
        -: Subtraktion: "ein1" & "ein3"
        *: Multiplikation: "ein1" & "ein3"
        /: Division: "ein1" & "ein3"
        %: Modulo: "ein1" & "ein3"
        otherwise: Ausgabe: "Fehler in der Berechnung"
    end case
    Ausgabe: Ergebnis
end

 

Programmiersprache C:

#include <stdio.h> 
#define MAXLENGTHSTR 255

int main(void)
{
  /* Deklaration der Variablen */
  int ein1, ein3, aus;
  char ein2;
  char s1[MAXLENGTHSTR];

  printf("z.B.: \"1 + 2\" oder \"5 + 5\" eingeben!!!"); 
  /* Usereingabe */
  printf("Eingabe: ");
  /* flushall(); gets(s1); */
  gets(s1);

  /* Interne Verarbeitung des Input */
  sscanf(s1, "%d %c %d", &ein1, &ein2, &ein3);
  aus = 0;

  /* Berechnung */
  switch(ein2)
  {
    case '+': aus = ein1 + ein3; break; /* Addition */
    case '-': aus = ein1 - ein3; break; /* Subtraktion */
    case '*': aus = ein1 * ein3; break; /* Multiplikation */
    case '/': aus = ein1 / ein3; break; /* Division */
    case '%': aus = ein1 % ein3; break; /* Modulo */
    default: printf("   Input error!\n"); break;
  }
 
  /* Ausgabe */
  printf("Ergebnis: %d\n", aus);

  /* Ende */
  return 0;
}

Crashkurs: jQuery-Selektoren

Was ist jQuery?

Es ist eine Vereinfachung von JavaScript durch ein sogenanntes Framework, welches uns lästige Routinearbeit beim Programmieren abnimmt und einen einfachen Zugang zu schwer nutzbaren JavaScript-Methoden bietet.

 

JavaScript mit & ohne jQuery!

Für den Einstieg in das Thema möchte ich ein Beispiel mit JavaScript und den selben Effekt via jQuery zeigen.

JavaScript: (JavaScript_test1.html)

<html>
<head>
<title>JavaScript</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script tyle="text/javascript">
window.onload = function() {
	var elements = document.getElementById("box").getElementsByTagName("p");
	for (var i = 0; i < elements.length; i++) {
		if (elements[i].firstChild.data == "Zweiter Absatz") {
			elements[i].className = "green";
		}
	}
}
</script>
</head>
<body>
<div id="box">
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
</body>
</html>
Mit ein wenig Programmiererfahrung kann man den Quelltext direkt lesen und wer dieses Beispiel nicht versteht, sollte sich auf der folgenden Webseite umschauen > de.selfhtml.org/javascript/

 

jQuery: (jQuery_test1.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("p:contains('Zweiter Absatz')").css({ 'color' : '#009933' });
});
</script>
</head>
<body>
<div id="box">
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
</body>
</html>

Wie man an diesem Beispiel erkennen kann, sind die “Selektoren” ein sehr wichtiger / umfangreicher Teil von jQuery.

 

jQuery-Selektoren

Als nächstes möchte ich einige jQuery-Selektoren und Methoden zum Auswählen von HTML-Elementen zeigen. Doch zuerst sollten wir die selben Werkzeuge zum ausführen & debuggen von JavaScript (jQuery) nutzen. Da JavaScript direkt im Browser kompiliert wird, könnten wir die Code-Zeilen auch direkt im Browser ausführen: Firefox + Firebug oder z.B. hier html5snippet.net

Firebug zum debuggen
Firebug zum debuggen
JavaScript via Firebug ausführen
JavaScript via Firebug ausführen

 

Selektiert alle HTML-Elemente von einem bestimmten Typ. -> z.B.: $(“p”)

(jQuery_selektoren1.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("p").addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
</body>
</html>

 

Selektiert HTML-Elemente mit einer bestimmten ID. -> z.B.: $(“#box”)

(jQuery_selektoren2.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("#box").addClass("green");
});
</script>
</head>
<body>
<div id="box">
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
</body>
</html>

PS: ID’s müssen auf einer HTML-Seite einmalig sein!

 

Selektiert HTML-Elemente mit einer bestimmten CSS-Klasse. -> z.B.: $(“.box”)

(jQuery_selektoren3.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div div .box").addClass("green");
});
</script>
</head>
<body>
<div class="box">
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
<div>
	<div>
		<div class="box">
			<p>Erster Absatz</p>
			<p>Zweiter Absatz</p>
			<p>Dritter Absatz</p>
		</div>
	</div>
</div>
</body>
</html>

Hier wurde die Auswahl noch einmal via HTML-Tags (div) eingeschränkt.

 

Selektiert HTML-Elemente und die Auswahl weiterer Selektoren. -> z.B.: $(“div + .box”)

(jQuery_selektoren4.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div + .box").addClass("green");
});
</script>
</head>
<body>
<div class="box">
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
<div>
	<div>
		<div class="box">
			<p>Erster Absatz</p>
			<p>Zweiter Absatz</p>
			<p>Dritter Absatz</p>
		</div>
	</div>
</div>
<div class="box">
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
</body>
</html>

 

Selektiert alle HTML-Elemente X, die Kindknoten eines Elements Y sind. -> $(“X > Y”) -> z.B: $(“div > p”)

(jQuery_selektoren5.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div > p").addClass("green");
});
</script>
</head>
<body>
<div>
	<span>
		<p>Erster Absatz</p>
		<p>Zweiter Absatz</p>
		<p>Dritter Absatz</p>
	</span>
</div>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
</body>
</html>

 

Selektiert alle folgenden Geschwisterknoten eines Elements X, die den Typ Y besitzen. -> $(“X ~ Y”) -> z.B: $(“#start ~ p”)

(jQuery_selektoren6.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("#start ~ p").addClass("green");
});
</script>
</head>
<body>
<div>
	<p id="start">Erster Absatz</p>
	<p>Zweiter Absatz<p>
	<div>
		<p>Dritter Absatz<p>
	</div>
	<p>Vierter Absatz</p>
</div>
</body>
</html>

 

Selektiert die Kombination aus allen durch die Selektoren gewählten Knoten. -> z.B: $(“#p1, #p2, #p3”)

(jQuery_selektoren7.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("#p1, #p2, #p3").addClass("green");
});
</script>
</head>
<body>
<div id="box">
	<p id="p1">Erster Absatz</p>
	<p id="p2">Zweiter Absatz</p>
	<p id="p3">Dritter Absatz</p>
</div>
</body>
</html>

 

Selektiert bestimmte HTML-Kind-Tags. -> z.B: $(“#box”).find(“p”)

(jQuery_selektoren8.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("#box").find("p").addClass("green");
});
</script>
</head>
<body>
<div id="box">
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>
</html>

 

(jQuery_selektoren9.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("#box").find("*").addClass("green");
});
</script>
</head>
<body>
<div id="box">
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>
</html>

 

Selektiert über Attribute. -> z.B: $(“div[id]”)

(jQuery_selektoren10.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div[id]").addClass("green");
});
</script>
</head>
<body>
<div id="box">
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>
</html>

 

Selektiert über Attribute und dessen Werte. -> z.B: $(“div[id=’box’]”)

(jQuery_selektoren11.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div[id='box']").addClass("green");
});
</script>
</head>
<body>
<div id="box1">
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div id="box">
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>
</html>

 

Selektiert über HTML-Tags und dessen Anordnung in der HTML-Struktur. -> z.B: $(“div:first”)

(jQuery_selektoren12.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div:first").addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>
</html>

 

(jQuery_selektoren13.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div:last").addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>
</html>

 

Selektiert alle Elemente mit geradem Index innerhalb der aktuellen Auswahl. (0 ist even) -> z.B: $(“div p:even”)

(jQuery_selektoren14.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div p:even").addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
	<p>Vierter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
	<p>Vierter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
	<p>Vierter Absatz</p>
</div>
</body>
</html>

 

Selektiert alle Elemente mit ungeradem Index innerhalb der aktuellen Auswahl. (1 ist odd) -> z.B: $(“div p:odd”)

(jQuery_selektoren15.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div p:odd").addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
	<p>Vierter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
	<p>Vierter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
	<p>Vierter Absatz</p>
</div>
</body>
</html>

 

Selektiert alle Elemente die nicht zutreffen. -> z.B: $(“div:not(:last)”)

(jQuery_selektoren16.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div:not(:last)").addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>

 

Selektiert Elemente, die innerhalb der aktuellen Auswahl einen bestimmten Index haben. -> z.B: $(“div p:eq(1)”)

(jQuery_selektoren17.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div p:eq(1)").addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>

 

Selektiert alle Elemente, die innerhalb der aktuellen Auswahl einen bestimmten größeren Index haben. -> z.B: $(“div p:gt(1)”)

(jQuery_selektoren18.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div p:gt(1)").addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>

 

Selektiert alle Elemente, die innerhalb der aktuellen Auswahl einen bestimmten kleineren Index haben. -> z.B: $(“div p:lt(1)”)

(jQuery_selektoren19.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div p:lt(1)").addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>

 

Selektiert alle Elemente, die sich innerhalb der aktuellen Auswahl “bewegen”. -> z.B: $(“div p:animated”)

(jQuery_selektoren20.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	function run() {
		$("#test").slideToggle("slow",run);
	}
	run();

	$("div p:animated").addClass("green");
});
</script>
</head>
<body>
<div>
	<p id="test">Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>

 

Selektiert alle Elemente, die mindestens ein Element enthalten, auf die der Selektor zutrifft. -> z.B: $(“div:has(‘span’)”)

(jQuery_selektoren21.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div:has('span')").addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
</body>

 

Selektiert alle Elemente, die Elternelement eines anderen Knotens sind. (also sowohl von Element- als auch Textknoten) -> z.B: $(“p:parent”)

(jQuery_selektoren22.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("p:parent").addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<p></p>
	<p>Zweiter Absatz</p>
</div>
</body>

 

Selektiert alle Elemente, die über ein bestimmtes Attribut verfügen. -> z.B: $(“[name]”)

(jQuery_selektoren23.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("[name]").addClass("green");
});
</script>
</head>
<body>
<div>
	<p name="Erster_Absatz">Erster Absatz</p>
	<span name="Zweiter_Absatz">Zweiter Absatz</span>
	<p name="Dritter_Absatz">Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
</body>

 

Selektiert alle Elemente, die über ein bestimmtes Attribut mit einem bestimmten Wert verfügen. -> z.B: $(“span[name=’Zweiter_Absatz’]”)

(jQuery_selektoren24.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("span[name='Zweiter_Absatz']").addClass("green");
});
</script>
</head>
<body>
<div>
	<p name="Erster_Absatz">Erster Absatz</p>
	<span name="Zweiter_Absatz">Zweiter Absatz</span>
	<p name="Dritter_Absatz">Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
</body>

 

Selektiert ein Element, wenn das Attribut einen bestimmten Wert, oder den bestimmten Wert mit einem “Bindestrich” abgetrennten String folgt -> z.B: $(“p[name|=’Absatz’]”)

(jQuery_selektoren25.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("p[name|='Absatz']").addClass("green");
});
</script>
</head>
<body>
<div>
	<p name="Absatz-Erster">Erster Absatz</p>
	<p name="AbsatzZweiter">Zweiter Absatz</p>
	<p name="Absatz_Dritter">Dritter Absatz</p>
	<p name="Absatz-Vierter">Vierter Absatz</p>
</div>
</body>

 

Selektiert ein Element, wenn der Wert des benannten Attributs den übergebenen String als Substring enthält. -> z.B: $(“p[name*=’Absatz’]”)

(jQuery_selektoren26.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("p[name*='Absatz']").addClass("green");
});
</script>
</head>
<body>
<div>
	<p name="Absatz-Erster">Erster Absatz</p>
	<p name="AbsatzZweiter">Zweiter Absatz</p>
	<p name="Absatz_Dritter">Dritter Absatz</p>
	<p name="Absatz-Vierter">Vierter Absatz</p>
</div>
</body>

 

Selektiert ein Element, wenn der Wert des benannten Attributs durch Leerzeichen abgetrennten Teilwert des benannten Attributes oder dem vollständigen Wert entspricht. -> z.B: $(“p[name~=’Absatz’]”)

(jQuery_selektoren27.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("p[name~='Absatz']").addClass("green");
});
</script>
</head>
<body>
<div>
	<p name="Absatz Erster">Erster Absatz</p>
	<p name="AbsatzZweiter">Zweiter Absatz</p>
	<p name="Absatz_Dritter">Dritter Absatz</p>
	<p name="Absatz Vierter">Vierter Absatz</p>
</div>
</body>

 

Selektiert alle Elemente, die nicht einem bestimmten Attribut entsprechen. -> z.B: $(“p[name!=’Absatz’]”)

(jQuery_selektoren28.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("p[name!='Absatz']").addClass("green");
});
</script>
</head>
<body>
<div>
	<p name="Absatz">Erster Absatz</p>
	<p name="AbsatzZweiter">Zweiter Absatz</p>
	<p name="Absatz_Dritter">Dritter Absatz</p>
	<p name="Absatz Vierter">Vierter Absatz</p>
</div>
</body>

 

Selektiert alle Elemente, die mit einem bestimmten Attribut beginnen. -> z.B: $(“p[name^=’Absatz’]”)

(jQuery_selektoren29.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("p[name^='Absatz']").addClass("green");
});
</script>
</head>
<body>
<div>
	<p name="Erster_Absatz">Erster Absatz</p>
	<p name="AbsatzZweiter">Zweiter Absatz</p>
	<p name="Absatz_Dritter">Dritter Absatz</p>
	<p name="VierterAbsatz">Vierter Absatz</p>
</div>
</body>

 

Selektiert alle Knoten, die der erste (letzte) Kindknoten ihres Elternelements sind. -> z.B: $(“p[name^=’Absatz’]”)

(jQuery_selektoren30.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("p:first-child, p:last-child").addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
</body>

 

Erzeugt ein neues jQuery-Objekt aus dem unmittelbar folgendem Geschwisterknoten der Elemente der aktuellen Auswahl. -> z.B: $(“p”).next(‘span’)

(jQuery_selektoren31.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("p").next('span').addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
</body>

 

(jQuery_selektoren34.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("span").next().addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>

 

Holt die Kindelemente jedes Elements der Auswahl. -> z.B: $(“div”).children()

(jQuery_selektoren32.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div").children().addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
</body>

 

Erzeugt eine neue Auswahl aus den Elternknoten jedes Elements der aktuellen Auswahl. -> z.B: $(“span”).parent()

(jQuery_selektoren33.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("span").parent().addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
<div>
	<p>Erster Absatz</p>
	<p>Zweiter Absatz</p>
	<p>Dritter Absatz</p>
</div>
</body>

 

Erzeugt ein neues jQuery-Objekt aus den unmittelbar vorherigen Geschwisterknoten des Elemente der aktuellen Auswahl. -> z.B: $(“span”).prev()

(jQuery_selektoren35.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("span").prev().addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>

 

Erzeugt ein neues jQuery-Objekt aus allen folgenden Geschwisterknoten der Elemente der aktuellen Auswahl. -> z.B: $(“p”).nextAll()

(jQuery_selektoren36.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("p").nextAll().addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>

 

Erzeugt ein neues jQuery-Objekt aus allen vorherigen Geschwisterknoten der Elemente der aktuellen Auswahl. -> z.B: $(“p”).prevAll()

(jQuery_selektoren37.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("p").prevAll().addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
</div>
</body>

 

Bildet eine Auswahl aus allen Geschwisterknoten der Elemente der aktuellen Auswahl. -> z.B: $(“span”).siblings()

(jQuery_selektoren38.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("span").siblings().addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
	<p>Vierter Absatz</p>
</div>
</body>

 

(jQuery_selektoren39.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("span").siblings().add("span").addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
	<p>Vierter Absatz</p>
</div>
</body>

 

Bildet auf der Decendant-Achse der Elemente der aktuellen Auswahl eine neue Auswahl aus Elementen, die dem angegebenen Selektor entsprechen. -> z.B: $(“div p”).filter(‘:contains(Erster Absatz)’)

(jQuery_selektoren40.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div p").filter(':contains(Erster Absatz)').addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
	<p>Vierter Absatz</p>
</div>
</body>

 

Bildet auf der Decendant-Achse der Elemente der aktuellen Auswahl eine neue Auswahl aus Elementen, die dem angegebenen Selektor nicht entsprechen. -> z.B: $(“div p”).not(‘:contains(Erster Absatz)’)

(jQuery_selektoren41.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	$("div p").not(':contains(Erster Absatz)').addClass("green");
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
	<p>Vierter Absatz</p>
</div>
</body>

 

(jQuery_selektoren42.html)

<html>
<head>
<title>JavaScript mit und ohne jQuery!</title>
<style type="text/css">
.green { color: #009933; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
	var auswahl = $("div p");

	auswahl.clone().appendTo('#test');
	auswahl.not(':contains(Erster Absatz)').addClass("green").end().css({ 'color' : 'red', 'background-color' : 'black' }).last().css({ 'color' : 'yellow'});
});
</script>
</head>
<body>
<div>
	<p>Erster Absatz</p>
	<span>Zweiter Absatz</span>
	<p>Dritter Absatz</p>
	<p>Vierter Absatz</p>
</div>
<br>
<div id="test"></div>
</body>

 

jQuery-Beispiel

Zum Schluss möchte ich noch ein einfaches Beispiel mit Selektoren zeigen …

(jQuery-Selektoren_test.html)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>jQuery-Selektoren | Beispiel</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>

<h1>TEST: JPEG + PNG</h1>

<div class="pic_all" style="float: left; overflow: hidden; width: 85px; height: 54px; margin: 0 3px 3px 0; text-align: center; border: 1px solid #ffffff;">
	<img src="SUCKUP_PNG.png" alt="PNG: Original > 10 KB" height="54">
</div>
<div class="pic_all" style="float: left; overflow: hidden; width: 85px; height: 54px; margin: 0 3px 3px 0; text-align: center; border: 1px solid #ffffff;">
	<img src="SUCKUP_PNG_punypng.png" alt="PNG: Optimized > 9 KB" height="54">
</div>
<div class="pic_all" style="float: left; overflow: hidden; width: 85px; height: 54px; margin: 0 3px 3px 0; text-align: center; border: 1px solid #ffffff;">
	<img src="SUCKUP_JPEG_100.jpg" alt="JPEG: 100% Qualität > 27 KB" height="54">
</div>
<div class="pic_all" style="float: left; overflow: hidden; width: 85px; height: 54px; margin: 0 3px 3px 0; text-align: center; border: 1px solid #ffffff;">
	<img src="SUCKUP_JPEG_80.jpg" alt="JPEG: 80% Qualität > 9 KB" height="54">
</div>
<div class="pic_all" style="float: left; overflow: hidden; width: 85px; height: 54px; margin: 0 3px 3px 0; text-align: center; border: 1px solid #ffffff;">
	<img src="SUCKUP_JPEG_60.jpg" alt="JPEG: (60% Qualität > 7 KB" height="54">
</div>

<br clear:both><div style="float:left">
	<img style="margin-top: 50px; margin-left: -450px;" id="refMain" src=""><br>
	<div style="width: 420px; margin-left: -450px;" id="imageText"></div>
</div>

<script type="text/javascript">
$('div.pic_all').css({ 'border-color' : '#ffffff', '-moz-opacity' :'0.4' });
$(document).ready(function() {
	$('div.pic_all').each(function() {
		$(this).mouseenter(function() {
			$(this).css('border-color', '#EE398C').css('-moz-opacity', '1');
			$('div.pic_all').css({ 'border-color' : '#ffffff', '-moz-opacity' :'0.4' });
			$(this).css('border-color', '#EE398C').css('-moz-opacity', '1');
			var src_new = $(this).find('img').attr('src');
 			$('#refMain').attr('src', src_new);
 			var text_new = $(this).find('img').attr('alt');
 			$('#imageText').html(text_new);
		});
		$(this).mouseleave(function() {
			$(this).css('border-color', '#ffffff').css('-moz-opacity', '0.4');
			if ($(this).find('img').attr('src') == $('#refMain').attr('src')) {
				$(this).css('border-color', '#EE398C').css('-moz-opacity', '1');
			}
		});
 	});
});
</script>

</body>
</html>

Optimierungen von Android unter Linux nutzen

Vor einiger Zeit habe ich ein kleines Shell-Script (SSSwitch – auto-switch settings) geschrieben, welches mein Android Handy beim Start optimiert und die Kernel-Einstellungen anpasst, wenn der Bildschirm an bzw. aus ist. Einige der Einstellungen kann man auch unter Linux verwenden. Als Beispiel beschreibe ich hier kurz, wie man die I/O Leistung verbessern kann und wer allgemein etwas zum optimieren von Linux / Ubuntu lesen möchte, dem hilft ggf. folgender Blog-Post weiter -> SpeedUp-Ubuntu ;)

 

Ein Ausschnitt aus dem besagtem Skript …

# =========
# One-time tweaks to apply on every boot;
# =========
STL=`ls -d /sys/block/stl*`;
BML=`ls -d /sys/block/bml*`;
MMC=`ls -d /sys/block/mmc*`;

… hier wurde der externe / interne Speicher von Android angegeben unter meinem Linux-System würde ich hier also z.B. folgendes angeben.

SDA=`ls -d /sys/block/sda/*`;

# =========
# Remount all partitions
# =========
for k in $(busybox mount | cut -d " " -f3);
do
	sync;
	busybox mount -o remount,noatime,nodiratime $k;
done;

“atime – Update inode access time for each access. See also the strictatime mount option.” – man mount Hier schalten wir die Funktion aus, welche aufzeichnet wann ein Datei oder Verzeichnis zuletzt angesehen wurde, da wir diese Funktionalität unter Android selten benötigen werden. ;) Ggf. kann man diesen Abschnitt komplett so unter Linux / Ubuntu verwenden z.B.:

mount
/dev/sda5 on / type ext4 (rw,errors=remount-ro,commit=0)
[...]
/dev/sda3 on /boot type ext2 (rw)
/dev/sda6 on /home type ext4 (rw,commit=0)
[...]
for k in $(busybox mount | cut -d " " -f3); do sync; mount -o remount,noatime,nodiratime $k; done;
mount
/dev/sda5 on / type ext4 (rw,noatime,nodiratime,errors=remount-ro)
[...]
/dev/sda3 on /boot type ext2 (rw,noatime,nodiratime)
/dev/sda6 on /home type ext4 (rw,noatime,nodiratime)
[...]

… wie man sieht sind die neuen Mount-Optionen nun aktiv. Wer mehr dazu erfahren möchte findet in dem bereits erwähnten “SpeedUp Ubuntu“-Beitrag unter dem Punkt “3.1) Filesystem” mehr Infos.

# =========
# check enabled/disabled status for IO settings
# =========
if [ "$IO_SETTINGS_ENABLED" -eq "1" ];
then
	# =========
	# Optimize non-rotating storage
	# =========
	for i in $STL $BML $MMC;
	do
		/system/xbin/echo "1" > $i/queue/iosched/rq_affinity;
		/system/xbin/echo "1" > $i/queue/iosched/low_latency;
		/system/xbin/echo "64" > $i/queue/max_sectors_kb;
		/system/xbin/echo "$READ_AHEAD_ALL" > $i/queue/read_ahead_kb;
	done;

Hier legen wir unter anderem die Puffergröße von unseren Speichermedien ein. Als Beispiel zeige ich kurz wie sich der Buffer auf die Lesegeschwindigkeit auswirkt, wenn eine Datei z.B. erneut geöffnet wird. ;) Dazu benötigen wir zuerst einen Compiler (gcc)

sudo apt-get install gcc

Nun den folgenden Quelltext kopieren …

#include 
#include <stdio.h>
#include <unistd.h>
#include <sys/times.h>
#include <sys/stat.h>
#include <fcntl.h>
#include <stdlib.h>

#define MAX_PUFFER_GROESSE 1<<14
// Ausgabe
static void zeit_ausgabe(long int puff_groesse, clock_t realzeit, struct tms *start_zeit, struct tms *ende_zeit, long int schleiflaeufe);

int main(void) {
    char puffer[MAX_PUFFER_GROESSE];
    ssize_t n;
    long int i, j=0, puffer_groesse, opt_puffer;
    struct tms start_zeit, ende_zeit;
    static long ticks=0;
    clock_t uhr_start, uhr_ende, system_cpu=0.0;

    // Ausgabe
    fprintf(stderr, "+--------------+-------------+--------------+--------------+--------------+\n");
    fprintf(stderr, "| %-10s | %-10s | %-10s | %-10s | %-10s |\n",
                    "Puffer-", "UserCPU", "SystemCPU", "Gebrauchte", "Schleifen-");
    fprintf(stderr, "| %10s | %10s | %10s | %10s | %10s |\n",
                    " groesse", " (Sek)", " (Sek)", " Uhrzeit", " laeufe");
    fprintf(stderr, "+--------------+-------------+--------------+--------------+--------------+\n");

    while (j <= 14) {
        i=0;
        puffer_groesse=1<<j;
        if (lseek(STDIN_FILENO, 0L, SEEK_SET) == -1) {
            fprintf(stderr, "Error: lseek");
            exit(1);
        }
        if (lseek(STDOUT_FILENO, 0L, SEEK_SET) == -1) {
            fprintf(stderr, "Errir: lseek");
            exit(1);
        }
        if ( (uhr_start = times(&start_zeit)) == -1) {
            fprintf(stderr, "Error: times");
            exit(2);
        }
        while ( (n=read(STDIN_FILENO, puffer, puffer_groesse)) > 0) {
            if (write(STDOUT_FILENO, puffer, n) != n) {
                fprintf(stderr, "Error: write");
                exit(3);
            }
            i++;
        }
        if (n < 0) {
            fprintf(stderr, "Error: read");
            exit(4);
        }
        if ( (uhr_ende = times(&ende_zeit)) == -1) {
            fprintf(stderr, "Error: times");
            exit(5);
        }

        if (ticks == 0) {
            if ( (ticks = sysconf(_SC_CLK_TCK)) < 0) {
                fprintf(stderr, "Error: sysconf");
                exit(6);
            }
        }
        // Ausgabe
        zeit_ausgabe(puffer_groesse, uhr_ende-uhr_start, &start_zeit, &ende_zeit, i);
        j++;
    }
    exit(0);
}

// Ausgabe
static void zeit_ausgabe(long int puff_groesse, clock_t realzeit, struct tms *start_zeit, struct tms *ende_zeit, long int schleiflaeufe) {
    static long ticks=0;
    if (ticks == 0) {
        if ( (ticks = sysconf(_SC_CLK_TCK)) < 0) {
            fprintf(stderr, "Error: sysconf");
            exit(6);
        }
    }
    fprintf(stderr, "| %10ld | %10.2f | %10.2f | %10.2f | %10ld |\n", puff_groesse, (ende_zeit->tms_utime - start_zeit->tms_utime) / (double)ticks, (ende_zeit->tms_stime - start_zeit->tms_stime) / (double)ticks, realzeit / (double)ticks, schleiflaeufe);
    return;
}

… und in eine leere Datei (io_speed_buffer.c) einfügen, nun compilieren wir noch schnell das Programm mit folgendem Befehl …

gcc io_speed_buffer.c -o io_speed_buffer

… als nächsten benötigen wir eine etwa 10 MB große Datei als Eingabe, diese erzeugen wir mittels “dd” im aktuellen Verzeichnis.

dd if=/dev/zero of=./test count=20000

Und schon können wir mittels folgenden Befehl die optimale Buffer-Größe herausfinden. Wobei man bei minimaler Verbesserung nicht den höheren Wert nutzen sollte.

z.B.:

./io_speed_buffer <test >test2
+--------------+-------------+--------------+--------------+--------------+
| Puffer-    | UserCPU    | SystemCPU  | Gebrauchte | Schleifen- |
|    groesse |      (Sek) |      (Sek) |    Uhrzeit |     laeufe |
+--------------+-------------+--------------+--------------+--------------+
|          1 |       0.48 |      10.41 |      10.90 |   10240000 |
|          2 |       0.26 |       3.40 |       3.66 |    5120000 |
|          4 |       0.19 |       1.64 |       1.83 |    2560000 |
|          8 |       0.12 |       0.80 |       0.92 |    1280000 |
|         16 |       0.01 |       0.46 |       0.47 |     640000 |
|         32 |       0.03 |       0.20 |       0.23 |     320000 |
|         64 |       0.00 |       0.12 |       0.12 |     160000 |
|        128 |       0.00 |       0.07 |       0.07 |      80000 |
|        256 |       0.00 |       0.04 |       0.04 |      40000 |
|        512 |       0.00 |       0.02 |       0.02 |      20000 |
|       1024 |       0.00 |       0.02 |       0.02 |      10000 |
|       2048 |       0.00 |       0.01 |       0.01 |       5000 |
|       4096 |       0.00 |       0.00 |       0.00 |       2500 |
|       8192 |       0.00 |       0.01 |       0.01 |       1250 |
|      16384 |       0.00 |       0.01 |       0.01 |        625 |

Standardmäßig ist der Wert “128” gesetzt …

cat /sys/block/sda/queue/read_ahead_kb
128

… welchen wir jedoch leicht ändern können! ;)

sudo echo "256" > /sys/block/sda/queue/read_ahead_kb
cat /sys/block/sda/queue/read_ahead_kb
256

Ggf. kann man diese Einstellungen auch unter Linux direkt beim start ausführen lassen z.B. könnte man den zuvor gezeigten “echo”-Befehl in der “rc.local”-Datei einfügen. (/etc/rc.local)

	# =========
	# Optimize io scheduler
	# =========
	for i in $STL $BML $MMC;
	do
		/system/xbin/echo "$IO_SCHEDULER" > $i/queue/scheduler;

Welcher I/O Scheduler der beste für das Speichermedium ist kann man am betesten selber testen, indem man z.B. wieder den “dd”-Befehl verwendet. -> [Discussion] SSSwitch – auto-switch settings PS: Für mein Android-System nutze ich momentan “bfq” wobei “noop” gerade für SSD-Speichermedien schneller sein soll …

		case $IO_SCHEDULER in
		"cfq")
    		        /system/xbin/echo "0" > $i/queue/rotational;
      		        /system/xbin/echo "1" > $i/queue/iosched/back_seek_penalty;
      		        /system/xbin/echo "1" > $i/queue/iosched/low_latency;
     		        /system/xbin/echo "3" > $i/queue/iosched/slice_idle;
      		        /system/xbin/echo "16" > $i/queue/iosched/quantum;
      		        /system/xbin/echo "2048" > $i/queue/nr_requests;
			/system/xbin/echo "1000000000" > $i/queue/iosched/back_seek_max;;
		"bfq")
			/system/xbin/echo "0" > $i/queue/rotational;
			/system/xbin/echo "1" > $i/queue/iosched/back_seek_penalty;
			/system/xbin/echo "1" > $i/queue/iosched/low_latency;
			/system/xbin/echo "3" > $i/queue/iosched/slice_idle;
			/system/xbin/echo "16" > $i/queue/iosched/quantum;
			/system/xbin/echo "2048" > $i/queue/nr_requests;
			/system/xbin/echo "1000000000" > $i/queue/iosched/back_seek_max;;
		"noop")
			/system/xbin/echo "4" > $i/queue/iosched/quantum;
			/system/xbin/echo "16" > $i/queue/iosched/fifo_batch;
			/system/xbin/echo "248" > $i/queue/nr_requests;;
		"deadline")
			/system/xbin/echo "1" > $i/queue/iosched/front_merges;
      		        /system/xbin/echo "16" > $i/queue/iosched/fifo_batch;;
		"sio")
      		        /system/xbin/echo "1" > $i/queue/iosched/front_merges;
			/system/xbin/echo "4" > $i/queue/iosched/quantum;
			/system/xbin/echo "16" > $i/queue/iosched/fifo_batch;
			/system/xbin/echo "256" > $i/queue/nr_requests;;
		esac;
[...]
	done;
[...]
fi;

Hier noch ein-wenig Feintuning für die entsprechenden I/O Scheduler ;) ggf. müssen diese Werte auf anderen Systemen (Hardware) angepasst werden, dies habe ich bisher nur auf meinem Android System getestet. Falls euch / jemanden dieser Blog-Beitrag gefallen hat, werde ich weitere Einstellungen von dem Skript erklären … :)

Screenshots von Android via shell

Wenn man auf seinem Android beispielsweise einen Kernel mit 24bpp Unterstützung installiert, kann man auch wenn man root-Rechte hat, keine Screenshot via App machen. Um dies zu umgehen kann man die “Android Debug Bridge (adb)” verwenden.

sudo apt-get install ffmpeg
/opt/android-sdk-linux_x86/platform-tools/adb pull /dev/graphics/fb0 fb0
ffmpeg -vframes 1 -vcodec rawvideo -f rawvideo -pix_fmt rgb32 -s 320x480 -i fb0 -f image2 -vcodec png image.png

 

Das gleich Verfahren kann man auch unter Windows anwenden und wer lieber mit einer GUI arbeitet, sollte sich einmal QtADB anschauen. ;)