Sebastien/GSDom
1
1
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

Ajout d'un fichier de test

Browse Source
This commit is contained in:
Sébastien G.
2022-01-05 21:13:10 +01:00
parent 7cb8d50e7d
commit d6cad0ecee
1 changed files with 93 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

93
test/index.html Normal file
View File

@@ -0,0 +1,93 @@
<html>
<head>
<title>
Page de test de la bibliothèque GSDom
</title>
</head>
<body>
<h1>Page de test de la bibliothèque GSDom</h1>
<div id="main">
<p>n°<span class="number">#</span> : Première ligne de <span class="texte">texte</span> <a href="#" class="bleu">En
bleu</a> <a href="#" class="rouge">En rouge</a> <a href="#" class="swap">Swappe bleu/rouge</a></p>
<p>n°<span class="number">#</span> : Première ligne de <span class="texte">texte</span> <a href="#" class="bleu">En
bleu</a> <a href="#" class="rouge">En rouge</a> <a href="#" class="swap">Swappe bleu/rouge</a></p>
<p>n°<span class="number">#</span> : Première ligne de <span class="texte">texte</span> <a href="#" class="bleu">En
bleu</a> <a href="#" class="rouge">En rouge</a> <a href="#" class="swap">Swappe bleu/rouge</a></p>
<p>n°<span class="number">#</span> : Première ligne de <span class="texte">texte</span> <a href="#" class="bleu">En
bleu</a> <a href="#" class="rouge">En rouge</a> <a href="#" class="swap">Swappe bleu/rouge</a></p>
<p>n°<span class="number">#</span> : Première ligne de <span class="texte">texte</span> <a href="#" class="bleu">En
bleu</a> <a href="#" class="rouge">En rouge</a> <a href="#" class="swap">Swappe bleu/rouge</a></p>
</div>
<a href="#" class="allgreen">Toutes les lignes en vert</a><br>
<a href="#" class="lastpurple">Dernière ligne en violet</a><br>
<a href="#" class="numerote">Numéroter les lignes</a><br>
<a href="#" class="bold">Texte en gras</a><br>
<div id="other">
<h3>2ème Div</h3>
<p>Un autre paragraphe</p>
</div>
<style>
.red {
color: red;
}
.blue {
color: blue;
}
.green {
color: green;
}
.purple {
color: purple;
}
</style>
<script src="../src/gsdom.js"></script>
<script>
$_('a.bleu').onClick((evt, el) => {
$_(el.parentElement).removeAllClass().addClass("blue");
}, true);
$_('a.rouge').onClick((evt, el) => {
$_(el.parentElement).removeAllClass().addClass("red");
}, true);
$_('a.swap').onClick((evt, el) => {
if (el.parentElement.classList.contains("blue")) {
$_(el.parentElement).replaceClass("blue", "red");
} else if (el.parentElement.classList.contains("red")) {
$_(el.parentElement).replaceClass("red", "blue");
}
}, true);
$_("a.allgreen").onClick((evt, el) => {
$_("p", "div").removeAllClass().addClass("green");
}, false);
$_("a.lastpurple").onClick((evt, el) => {
$_("p", "div#main").last().removeAllClass().addClass("purple");
}, false);
$_("a.bold").onClick(
(evt, el) => {
$_("p span.texte", "div#main").each(
(item, index) => {
item.style.fontWeight = "bold";
}
);
}, false
);
$_("a.numerote").onClick(
(evt, el) => {
$_("p span.number", "div#main").each(
(item, index) => {
item.textContent = index + 1;
}
);
}, false
);
console.log($_("p").first(true));
</script>
</body>
</html>