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

Mise à jour de la documentation

Browse Source
This commit is contained in:
Sébastien G.
2022-01-03 23:38:56 +01:00
parent 4512c40a97
commit 08864af580
4 changed files with 309 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

288
DOCUMENTATION.md
View File

@@ -19,29 +19,45 @@
- [Examples][15]
- [setAttr][16]
- [Parameters][17]
- [delAttr][18]
- [Parameters][19]
- [setHidden][20]
- [setReadOnly][21]
- [setDisabled][22]
- [delHidden][23]
- [delReadOnly][24]
- [delDisabled][25]
- [toggleHidden][26]
- [toggleReadOnly][27]
- [toggleDisabled][28]
- [on][29]
- [Parameters][30]
- [onClick][31]
- [Parameters][32]
- [found][33]
- [first][34]
- [last][35]
- [gsd][36]
- [Parameters][37]
- [version][38]
- [gsd][39]
- [version][40]
- [Examples][18]
- [delAttr][19]
- [Parameters][20]
- [Examples][21]
- [setHidden][22]
- [Examples][23]
- [setReadOnly][24]
- [Examples][25]
- [setDisabled][26]
- [Examples][27]
- [delHidden][28]
- [Examples][29]
- [delReadOnly][30]
- [Examples][31]
- [delDisabled][32]
- [Examples][33]
- [toggleHidden][34]
- [Examples][35]
- [toggleReadOnly][36]
- [Examples][37]
- [toggleDisabled][38]
- [Examples][39]
- [on][40]
- [Parameters][41]
- [Examples][42]
- [onClick][43]
- [Parameters][44]
- [Examples][45]
- [found][46]
- [Examples][47]
- [first][48]
- [Examples][49]
- [last][50]
- [Examples][51]
- [gsd][52]
- [Parameters][53]
- [version][54]
- [gsd][55]
- [version][56]
## Constructor
@@ -49,8 +65,8 @@ Création du constructeur
### Parameters
- `selector` **[String][41]** Sélecteur utilisé
- `scope` **[HTMLElement][42]** Racine de la recherche
- `selector` **[String][57]** Sélecteur utilisé
- `scope` **[HTMLElement][58]** Racine de la recherche
### Examples
@@ -65,7 +81,7 @@ Application d'une fonction sur chacun des éléments
#### Parameters
- `callback` **[Function][43]** La fonction de rappel
- `callback` **[Function][59]** La fonction de rappel
#### Examples
@@ -81,7 +97,7 @@ Ajout d'une classe aux éléments sélectionnés
#### Parameters
- `className` **[String][41]** Le nom de la classe à ajouter
- `className` **[String][57]** Le nom de la classe à ajouter
#### Examples
@@ -97,7 +113,7 @@ Suppression d'une classe aux éléments sélectionnés
#### Parameters
- `className` **[String][41]** Le nom de la classe à ajouter
- `className` **[String][57]** Le nom de la classe à ajouter
#### Examples
@@ -113,8 +129,8 @@ Remplace une classe par une autre dans les éléments sélectionnés
#### Parameters
- `oldClass` **[String][41]** Nom de la classe à remplacer
- `newClass` **[String][41]** Nom de la classe de remplacement
- `oldClass` **[String][57]** Nom de la classe à remplacer
- `newClass` **[String][57]** Nom de la classe de remplacement
#### Examples
@@ -130,8 +146,14 @@ Définit un attribut et sa valeur
#### Parameters
- `attr` **[String][41]** Nom de l'attribut
- `value` **[String][41]** Valeur de l'attribut
- `attr` **[String][57]** Nom de l'attribut
- `value` **[String][57]** Valeur de l'attribut
#### Examples
```javascript
$_("input.class").setAttr("readonly", "");
```
Returns **this** Chainage
@@ -141,7 +163,13 @@ Supprime un attribut dans les éléments sélectionnés
#### Parameters
- `attr` **[String][41]** Nom de l'attribut à supprimer
- `attr` **[String][57]** Nom de l'attribut à supprimer
#### Examples
```javascript
$_(input.class).delAttr("readonly");
```
Returns **this** Chainage
@@ -149,54 +177,108 @@ Returns **this** Chainage
Ajoute l'attribut hidden aux éléments sélectionnés
#### Examples
```javascript
$_("span.class").setHidden();
```
Returns **this** Chainage
### setReadOnly
Ajoute l'attribut readonly aux éléments sélectionnés
#### Examples
```javascript
$_("input.class").setReadOnly();
```
Returns **this** Chainage
### setDisabled
Ajoute l'attribut disabled aux éléments sélectionnés
#### Examples
```javascript
$_("input.class").setDisabled();
```
Returns **this** Chainage
### delHidden
Supprime l'attribut hidden aux éléments sélectionnés
#### Examples
```javascript
$_("span.class").delHidden();
```
Returns **this** Chainage
### delReadOnly
Supprime l'attribut readonly aux éléments sélectionnés
#### Examples
```javascript
$_("input.class").delReadOnly();
```
Returns **this** Chainage
### delDisabled
Supprime l'attribut disabled aux éléments sélectionnés
#### Examples
```javascript
$_("input.class").delDisabled();
```
Returns **this** Chainage
### toggleHidden
switche l'attribut hidden des éléments sélectionnés
#### Examples
```javascript
$_("span.class").toggleHidden();
```
Returns **this** Chainage
### toggleReadOnly
switche l'attribut readonly des éléments sélectionnés
#### Examples
```javascript
$_("input.class").toggleReadOnly();
```
Returns **this** Chainage
### toggleDisabled
switche l'attribut disabled des éléments sélectionnés
#### Examples
```javascript
$_("input.class").toggleDisabled();
```
Returns **this** Chainage
### on
@@ -205,9 +287,17 @@ Ajout d'un gestionnaire d'événement aux éléments sélectionnés
#### Parameters
- `type` **[String][41]** Nom de l'événement
- `callback` **[Function][43]** Gestionnaire de l'événement
- `useCapture` **[Boolean][44]** Propagation de l'événement
- `type` **[String][57]** Nom de l'événement
- `callback` **[Function][59]** Gestionnaire de l'événement
- `useCapture` **[Boolean][60]** Propagation de l'événement
#### Examples
```javascript
$_("button#event").on("mouseover", (evt, el) => {
// Do something with evt and el
}, false);
```
### onClick
@@ -215,26 +305,52 @@ Ajout d'un gestionnaire d'événement 'click' pour les éléments sélectionnés
#### Parameters
- `callback` **[Function][43]** Gestionnaire de l'événement
- `useCapture` **[Boolean][44]** Propagation de l'événement
- `callback` **[Function][59]** Gestionnaire de l'événement
- `useCapture` **[Boolean][60]** Propagation de l'événement
#### Examples
```javascript
$_("button#event").onClick( (evt, el) => {
// Do something with evt and el
}, false);
```
### found
Retourne si un élément a été trouvé
Returns **[Boolean][44]** l'élément du DOM trouvé
#### Examples
```javascript
let found = $_("#main").found();
```
Returns **[Boolean][60]** l'élément du DOM trouvé
### first
Retourne le premier élément trouvé
Returns **[HTMLElement][42]** l'élément du DOM trouvé
#### Examples
```javascript
let htmlElement = $_("p.paragraphe").first();
```
Returns **[HTMLElement][58]** l'élément du DOM trouvé
### last
Retourne le dernier élément trouvé
Returns **[HTMLElement][42]** L'élément du DOM trouvé
#### Examples
```javascript
let htmlElement = $_("p.paragraphe").last();
```
Returns **[HTMLElement][58]** L'élément du DOM trouvé
## gsd
@@ -242,9 +358,9 @@ Instantiation d'un nouveau constructeur
### Parameters
- `selector` **[String][41]** Sélecteur utilisé
- `selector` **[String][57]** Sélecteur utilisé
- `root`
- `scope` **[HTMLElement][42]** Racine de la recherche
- `scope` **[HTMLElement][58]** Racine de la recherche
### version
@@ -292,56 +408,88 @@ Version de la librairie
[17]: #parameters-5
[18]: #delattr
[18]: #examples-5
[19]: #parameters-6
[19]: #delattr
[20]: #sethidden
[20]: #parameters-6
[21]: #setreadonly
[21]: #examples-6
[22]: #setdisabled
[22]: #sethidden
[23]: #delhidden
[23]: #examples-7
[24]: #delreadonly
[24]: #setreadonly
[25]: #deldisabled
[25]: #examples-8
[26]: #togglehidden
[26]: #setdisabled
[27]: #togglereadonly
[27]: #examples-9
[28]: #toggledisabled
[28]: #delhidden
[29]: #on
[29]: #examples-10
[30]: #parameters-7
[30]: #delreadonly
[31]: #onclick
[31]: #examples-11
[32]: #parameters-8
[32]: #deldisabled
[33]: #found
[33]: #examples-12
[34]: #first
[34]: #togglehidden
[35]: #last
[35]: #examples-13
[36]: #gsd
[36]: #togglereadonly
[37]: #parameters-9
[37]: #examples-14
[38]: #version
[38]: #toggledisabled
[39]: #gsd-1
[39]: #examples-15
[40]: #version-1
[40]: #on
[41]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String
[41]: #parameters-7
[42]: https://developer.mozilla.org/docs/Web/HTML/Element
[42]: #examples-16
[43]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function
[43]: #onclick
[44]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean
[44]: #parameters-8
[45]: #examples-17
[46]: #found
[47]: #examples-18
[48]: #first
[49]: #examples-19
[50]: #last
[51]: #examples-20
[52]: #gsd
[53]: #parameters-9
[54]: #version
[55]: #gsd-1
[56]: #version-1
[57]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String
[58]: https://developer.mozilla.org/docs/Web/HTML/Element
[59]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function
[60]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean

21
README.md
View File

@@ -1,10 +1,27 @@
GSDom - Bibliothèque Javascript
===============================
GSDom est une petite bibliothèque javascript permettant d'effectuer des manipulations de base sur le DOM d'une page HTML.
GSDOM est compatible Emac2005 (ES6) et ne nécessite aucune bibliothèque externe.
GSDom permet de se passer de bibliothèques lourdes telles que jQuery pour les manipulations basiques
Installation
------------
Pour utiliser GSDom, il suffit de copier le fichier dist/gsdom.min.js dans l'arborescence de son projet et de l'intégrer dans sa page web de manière classique
```html
<script src="js/gsdom.min.js">
```
GSDom exporte le symbole $_ pour toute manipulation du DOM
```html
<script>
// Sélectionne tous les a du document et ajoute la classe myClass
$_("a").addClass("myClass");
</script>
```
Documentation
-------------
La documentation est générée automatiquement
[Documentation](DOCUMENTATION.md)
La [documentation](DOCUMENTATION.md) est générée automatiquement par le script de build

1
build_gsdom.sh
View File

@@ -1 +1,2 @@
terser --ecma=2015 --comments /^!/ --compress --mangle --output dist/gsdom.min.js -- src/gsdom.js
documentation build src/GSDom.js -f md > DOCUMENTATION.md

70
src/gsdom.js
View File

@@ -90,6 +90,10 @@ window.$_ = (() => {
};
/**
* Définit un attribut et sa valeur
*
* @example
* $_("input.class").setAttr("readonly", "");
*
* @param {String} attr Nom de l'attribut
* @param {String} value Valeur de l'attribut
* @returns {this} Chainage
@@ -102,6 +106,10 @@ window.$_ = (() => {
};
/**
* Supprime un attribut dans les éléments sélectionnés
*
* @example
* $_(input.class).delAttr("readonly");
*
* @param {String} attr Nom de l'attribut à supprimer
* @returns {this} Chainage
*/
@@ -113,6 +121,9 @@ window.$_ = (() => {
};
/**
* Ajoute l'attribut hidden aux éléments sélectionnés
*
* @example $_("span.class").setHidden();
*
* @returns {this} Chainage
*/
Constructor.prototype.setHidden = function () {
@@ -121,6 +132,10 @@ window.$_ = (() => {
};
/**
* Ajoute l'attribut readonly aux éléments sélectionnés
*
* @example
* $_("input.class").setReadOnly();
*
* @returns {this} Chainage
*/
Constructor.prototype.setReadOnly = function () {
@@ -129,6 +144,10 @@ window.$_ = (() => {
};
/**
* Ajoute l'attribut disabled aux éléments sélectionnés
*
* @example
* $_("input.class").setDisabled();
*
* @returns {this} Chainage
*/
Constructor.prototype.setDisabled = function () {
@@ -137,6 +156,10 @@ window.$_ = (() => {
};
/**
* Supprime l'attribut hidden aux éléments sélectionnés
*
* @example
* $_("span.class").delHidden();
*
* @returns {this} Chainage
*/
Constructor.prototype.delHidden = function () {
@@ -145,6 +168,10 @@ window.$_ = (() => {
};
/**
* Supprime l'attribut readonly aux éléments sélectionnés
*
* @example
* $_("input.class").delReadOnly();
*
* @returns {this} Chainage
*/
Constructor.prototype.delReadOnly = function () {
@@ -153,6 +180,10 @@ window.$_ = (() => {
};
/**
* Supprime l'attribut disabled aux éléments sélectionnés
*
* @example
* $_("input.class").delDisabled();
*
* @returns {this} Chainage
*/
Constructor.prototype.delDisabled = function () {
@@ -161,6 +192,10 @@ window.$_ = (() => {
};
/**
* switche l'attribut hidden des éléments sélectionnés
*
* @example
* $_("span.class").toggleHidden();
*
* @returns {this} Chainage
*/
Constructor.prototype.toggleHidden = function () {
@@ -175,6 +210,10 @@ window.$_ = (() => {
};
/**
* switche l'attribut readonly des éléments sélectionnés
*
* @example
* $_("input.class").toggleReadOnly();
*
* @returns {this} Chainage
*/
Constructor.prototype.toggleReadOnly = function () {
@@ -189,6 +228,10 @@ window.$_ = (() => {
};
/**
* switche l'attribut disabled des éléments sélectionnés
*
* @example
* $_("input.class").toggleDisabled();
*
* @returns {this} Chainage
*/
Constructor.prototype.toggleDisabled = function () {
@@ -203,6 +246,12 @@ window.$_ = (() => {
};
/**
* Ajout d'un gestionnaire d'événement aux éléments sélectionnés
*
* @example
* $_("button#event").on("mouseover", (evt, el) => {
* // Do something with evt and el
* }, false);
*
* @param {String} type Nom de l'événement
* @param {Function} callback Gestionnaire de l'événement
* @param {Boolean} useCapture Propagation de l'événement
@@ -218,6 +267,12 @@ window.$_ = (() => {
};
/**
* Ajout d'un gestionnaire d'événement 'click' pour les éléments sélectionnés
*
* @example
* $_("button#event").onClick( (evt, el) => {
* // Do something with evt and el
* }, false);
*
* @param {Function} callback Gestionnaire de l'événement
* @param {Boolean} useCapture Propagation de l'événement
*/
@@ -227,6 +282,10 @@ window.$_ = (() => {
};
/**
* Retourne si un élément a été trouvé
*
* @example
* let found = $_("#main").found();
*
* @returns {Boolean} l'élément du DOM trouvé
*/
Constructor.prototype.found = function () {
@@ -234,6 +293,10 @@ window.$_ = (() => {
};
/**
* Retourne le premier élément trouvé
*
* @example
* let htmlElement = $_("p.paragraphe").first();
*
* @returns {HTMLElement} l'élément du DOM trouvé
*/
Constructor.prototype.first = function () {
@@ -241,6 +304,10 @@ window.$_ = (() => {
};
/**
* Retourne le dernier élément trouvé
*
* @example
* let htmlElement = $_("p.paragraphe").last();
*
* @returns {HTMLElement} L'élément du DOM trouvé
*/
Constructor.prototype.last = function () {
@@ -248,6 +315,9 @@ window.$_ = (() => {
};
/**
* Instantiation d'un nouveau constructeur
*
* @internal
*
* @param {String} selector Sélecteur utilisé
* @param {HTMLElement} scope Racine de la recherche
*/