%Teilweise Erzeugt mit dem LaTeX-Generator: http://latex.sehnot.de
%Schriftgröße, Layout, Papierformat, Art des Dokumentes
\documentclass[10pt,oneside,a4paper]{scrartcl}
%Einstellungen der Seitenränder
\usepackage[left=2cm,right=2cm,top=1.5cm,bottom=1.5cm,includeheadfoot]{geometry}
%neue Rechtschreibung
\usepackage[ngerman]{babel}
%Umlaute ermöglichen
\usepackage[utf8]{inputenc}
%Gesamtseitenzahl
\usepackage{lastpage}
% Kopf- und Fußzeile
\usepackage[automark]{scrpage2}
%Quellcode-Listings
\usepackage{listings}
%Hyperlinks
\usepackage{hyperref}
\usepackage{listings}
\usepackage{color}
\definecolor{lightgray}{rgb}{.9,.9,.9}
\definecolor{darkgray}{rgb}{.4,.4,.4}
\definecolor{purple}{rgb}{0.65, 0.12, 0.82}
\lstdefinelanguage{JavaScript}{
keywords={typeof, new, true, false, catch, function, return, null, catch, switch, var, if, in, while, do, else, case, break},
keywordstyle=\color{blue}\bfseries,
ndkeywords={class, export, boolean, throw, implements, import, this},
ndkeywordstyle=\color{darkgray}\bfseries,
identifierstyle=\color{black},
sensitive=false,
comment=[l]{//},
morecomment=[s]{/*}{*/},
commentstyle=\color{purple}\ttfamily,
stringstyle=\color{red}\ttfamily,
morestring=[b]',
morestring=[b]"
}
\lstset{
language=JavaScript,
backgroundcolor=\color{lightgray},
extendedchars=true,
basicstyle=\footnotesize\ttfamily,
showstringspaces=false,
showspaces=false,
tabsize=2,
breaklines=true,
showtabs=false,
captionpos=b
}
%Kopfzeile
\ihead{JavaScript}
\chead{}
\ohead{http://kohnlehome.de/html/jquery.pdf}
\setheadsepline{0.5pt}
%Fußzeile
\setfootsepline{0.5pt}
\ifoot{Franz Kohnle}
\cfoot{Seite \thepage\ von \pageref{LastPage}}
\ofoot{\today}
\pagestyle{scrheadings}
\begin{document}
% Überschrift
\begin{center}
\LARGE % Schriftgröße
\bfseries % Fettdruck
\sffamily % Serifenlose Schrift
jQuery
\end{center}
\section{Download}
\href{http://jquery.com/}{jquery.com}
\section{Einbinden in HTML}
\subsection{lokal}
\lstset{language=html}
\begin{lstlisting}[]
// nicht selbstschliessend!
\end{lstlisting}
\subsection{vom CDN-Server}
\lstset{language=html}
\begin{lstlisting}[]
\end{lstlisting}
\section{HTML-Elemente auswählen (wie in CSS)}
\lstset{language=JavaScript}
\begin{lstlisting}[]
$('p') // alle p-Elemente
$('#bezeichner') // Element mit id="bezeichner"
$('.klasse') // alle Elemente mit class="klasse"
\end{lstlisting}
\section{Events}
\subsection{wenn DOM geladen ist}
\lstset{language=JavaScript}
\begin{lstlisting}[]
$(document).ready( function(){
...
});
\end{lstlisting}
\subsection{wenn Element mit id='bezeichner' angeklickt wird}
\lstset{language=JavaScript}
\begin{lstlisting}[]
$('#bezeichner').click( function(){
...
});
\end{lstlisting}
\subsection{sonstige Events}
\lstset{language=JavaScript}
\begin{lstlisting}[]
hover(), keydown(), keyup(), keypress(), mousedown(), mouseup(), mousemove(), change(), ...
\end{lstlisting}
\section{Methoden zum Anzeigen / Verbergen von Elementen}
\lstset{language=JavaScript}
\begin{lstlisting}[]
.slideUp(), .slideDown(), .hide(), .show(), .fadeIn(), .fadeOut(), ...
\end{lstlisting}
\section{Methoden zum Lesen / Ändern des Inhalts von Elementen}
\lstset{language=JavaScript}
\begin{lstlisting}[]
var text = $('#bezeichner').text(); // lesen
$('#bezeichner').text("Bla bla"); // zuweisen
\end{lstlisting}
\section{Dokumentation}
\paragraph{Offiziell} \href{http://docs.jquery.com/}{docs.jquery.com}
\paragraph{Download: Windows-Hilfedatei} \href{http://charupload.wordpress.com/2007/12/07/jquery-documentation-chm/}{charupload.wordpress.com/2007/12/07/jquery-documentation-chm/}
\end{document}