getElementsByTagName()

siehe auch mit Javascript auf Elemente zugreifen werner-zenk Tutorials


Hier sind die StyleSheets Grundlagen erforderlich. Siehe dazu mein CSS Tutorial.

Wie ihr hoffentlich in selfhtml nachgelesen habt, gibt es verschiedene Möglichkeiten auf Html Elemente zuzugreifen:
 getElementById,  getElementsByName und  getElementsByTagName (LINKS führen nach SELFHTML).

Um auf ein ganz bestimmtes Tag anzusprechen, wird die Position oder Reihenfolge beginnend bei 0 in eckigen Klammern notiert. Siehe hierzu auch das Thema Array.
getElementsByTagName("p") [0] wäre demnach der erste Absatz <p> der Html Seite.

<script type="text/javascript">
function bodyNeu () {
document.getElementsByTagName("body")[0].style.fontFamily = "Georgia, Times, sanserif";
}

function pSchrift (anzahl, schriftart) {
for(i=0; i<=anzahl; i++){
document.getElementsByTagName("p")[i].style.fontFamily = schriftart;
}
}
</script>

Dieser Link setzt die Schriftart als Eigenschaft des Body Tags auf "Georgia, Times, serif".
<a href="javascript:;" onclick="bodyNeu()">Link</a>
 
dieser Link setzt die Schriftart der ersten 3 Absätze auf "Georgia, Times, serif"
<a href="javascript:;" onclick="pSchrift(3,'Georgia, Times, serif')">Link</a>
Dieser Link setzt die Schriftart der ersten 5 Absätze auf "Verdana, Arial, sanserif"
<a href="javascript:;" onclick="pSchrift(5, 'Verdana, Arial, sanserif')">Link</a>

Erklärung
In der Funktion bodyNeu() wird über getElementsByTagName("body")[0] im Body Tag die style Eigenschaft fontFamily definiert. Der erste Link ruft die Funktion auf. Die zweite Funktion hat 2 Parameter: anzahl, schriftart. So hat man die Möglichkeit im Link zu bestimmen, wieviele p Tags gemessen vom ersten geändert werden sollen, und welche Schriftart zugewiesen werden soll. Näheres dazu unter Funktionen und For Schleife.
  nächste Seite

Javascript Tipps