Please enable JavaScript.
Coggle requires JavaScript to display documents.
DOM (Document Object Model) (Les méthodes permettant (La Recherche …
DOM
(Document Object Model)
Structure
Document
Root element
<html>
Element
<head>
Element
<title>
Text
: "MyTitle"
Element
<meta>
Element
<body>
Element
<h1>
Text
: "A heading"
Element
<a>
Attribut
:
href
Text
:
"Link text"
extrait de code illustrant l’accès au DOM
<!DOCTYPE html>
<html lang="en">
<head>
<title>Modifying an image border</title>
<script>
function setBorderWidth(width) {function setBorderWidth(width) {}
</script>
</head>
<body>
<p>
<img id="img1" src="image1.gif" style="border: 5px solid green;" width="100" height="100" alt="border test">
</p>
<form name="FormName">
<input type="button" value="Make border 20px-wide" onclick="setBorderWidth(20);" />
<input type="button" value="Make border 5px-wide" onclick="setBorderWidth(5);" />
</form>
</body>
</html>
Les méthodes permettant
La Recherche
Element.scrollIntoView()
Insertion
:
Insetion d'un texte:
Element.insertAdjacentText
Insetion d'un noeud d'elemnt:
Element.insertAdjacentElement
La modification
Remplacer:
replaceChild()
Ajouter:
element.setAttribute(attribute,value)
La suppression
Element.removeAttribute()
L'accès
By ID:*
document.getElementById(ID)
By classename:
document.getElementsByClassName(nomDeClasse)
By name
document.getElementByName(nom)
Le Role du dom
DOM permet aux programmes et scripts d'accéder et de modifier dynamiquement le contenu, la structure et le style de document HTML
Realisé par:
Fatma Maazoun
https://developer.mozilla.org/fr/docs/Web/API/Document_Object_Model
https://fr.wikipedia.org/wiki/Document_Object_Model#Aspects_techniques
attributs d'image: