648 lines
12 KiB
Markdown
648 lines
12 KiB
Markdown
<!-- Generated by documentation.js. Update this documentation by updating the source code. -->
|
|
|
|
### Table of Contents
|
|
|
|
* [GSDom][1]
|
|
* [Parameters][2]
|
|
* [Examples][3]
|
|
* [each][4]
|
|
* [Parameters][5]
|
|
* [Examples][6]
|
|
* [addClass][7]
|
|
* [Parameters][8]
|
|
* [Examples][9]
|
|
* [removeClass][10]
|
|
* [Parameters][11]
|
|
* [Examples][12]
|
|
* [removeAllClasses][13]
|
|
* [Examples][14]
|
|
* [replaceClass][15]
|
|
* [Parameters][16]
|
|
* [Examples][17]
|
|
* [setAttr][18]
|
|
* [Parameters][19]
|
|
* [Examples][20]
|
|
* [delAttr][21]
|
|
* [Parameters][22]
|
|
* [Examples][23]
|
|
* [setHidden][24]
|
|
* [Examples][25]
|
|
* [setReadOnly][26]
|
|
* [Examples][27]
|
|
* [setDisabled][28]
|
|
* [Examples][29]
|
|
* [delHidden][30]
|
|
* [Examples][31]
|
|
* [delReadOnly][32]
|
|
* [Examples][33]
|
|
* [delDisabled][34]
|
|
* [Examples][35]
|
|
* [toggleHidden][36]
|
|
* [Examples][37]
|
|
* [toggleReadOnly][38]
|
|
* [Examples][39]
|
|
* [toggleDisabled][40]
|
|
* [Examples][41]
|
|
* [on][42]
|
|
* [Parameters][43]
|
|
* [Examples][44]
|
|
* [onClick][45]
|
|
* [Parameters][46]
|
|
* [Examples][47]
|
|
* [found][48]
|
|
* [Examples][49]
|
|
* [first][50]
|
|
* [Parameters][51]
|
|
* [Examples][52]
|
|
* [last][53]
|
|
* [Parameters][54]
|
|
* [Examples][55]
|
|
* [items][56]
|
|
* [Examples][57]
|
|
* [count][58]
|
|
* [Examples][59]
|
|
* [itemAtIndex][60]
|
|
* [Parameters][61]
|
|
* [Examples][62]
|
|
* [version][63]
|
|
* [Parameters][64]
|
|
* [eachCallback][65]
|
|
* [Parameters][66]
|
|
* [evtCallback][67]
|
|
* [Parameters][68]
|
|
|
|
## GSDom
|
|
|
|
La classe GSDom est une classe écrite en pur Javascript qui permet de simplifier la manipulation du DOM.
|
|
|
|
### Parameters
|
|
|
|
* `selector` **([String][69] | [HTMLElement][70])** Sélecteur utilisé ou un élément du DOM (scope est alors ignoré)
|
|
* `scope` **([String][69] | [HTMLElement][70])** Sélecteur utilisé (le 1er élément trouvé est utilisé) ou un élément du DOM (optional, default `document`)
|
|
|
|
### Examples
|
|
|
|
```javascript
|
|
// Ajout d'une classe `my_class` à tous les `a`
|
|
$_("a").addClass("my_class");
|
|
```
|
|
|
|
```javascript
|
|
// Ajout d'une classe `my_class` à tous les `a` enfants de `div#main`
|
|
$_("a", "div#main").addClass("my_class");
|
|
```
|
|
|
|
```javascript
|
|
// Ajout d'une classe `my_class` à tous les `a` enfants de l'élément `my_scope` du DOM
|
|
let my_scope = document.querySelector("div#main");
|
|
$_("a", my_scope).addClass("my_class");
|
|
```
|
|
|
|
```javascript
|
|
// Instanciation de GSDom avec un élément du DOM et ajout d'une classe `my_class` à cet élément
|
|
let element = document.querySelector("p#intro");
|
|
$_(element).addClass("my_class");
|
|
```
|
|
|
|
### each
|
|
|
|
Parcours de tous les éléments sélectionnés
|
|
|
|
#### Parameters
|
|
|
|
* `callback` **[eachCallback][71]** La fonction de rappel
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
//appliquer une fonction sur tous les éléments ayant `my_class`
|
|
$_(".my_class").each((item, index) => {
|
|
// Do something with item et index
|
|
});
|
|
```
|
|
|
|
### addClass
|
|
|
|
Ajout d'une classe aux éléments sélectionnés
|
|
|
|
#### Parameters
|
|
|
|
* `className` **[String][69]** Le nom de la classe à ajouter
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("p","div#main").addClass("my_class");
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### removeClass
|
|
|
|
Suppression d'une classe aux éléments sélectionnés
|
|
|
|
#### Parameters
|
|
|
|
* `className` **[String][69]** Le nom de la classe à ajouter
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("p","div#main").removeClass("my_class");
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### removeAllClasses
|
|
|
|
Suppression de toutes les classes des éléments sélectionnés
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("p","div#main").removeAllClasses("myClass");
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### replaceClass
|
|
|
|
Remplace une classe par une autre parmi les éléments sélectionnés
|
|
|
|
#### Parameters
|
|
|
|
* `oldClass` **[String][69]** Nom de la classe à remplacer
|
|
* `newClass` **[String][69]** Nom de la classe de remplacement
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("p","div#main").replaceClass("my_old_class", "my_new_class");
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### setAttr
|
|
|
|
Définit un attribut et sa valeur
|
|
|
|
#### Parameters
|
|
|
|
* `attr` **[String][69]** Nom de l'attribut
|
|
* `value` **[String][69]** Valeur de l'attribut
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("input.my_class").setAttr("readonly", "");
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### delAttr
|
|
|
|
Supprime un attribut dans les éléments sélectionnés
|
|
|
|
#### Parameters
|
|
|
|
* `attr` **[String][69]** Nom de l'attribut à supprimer
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_(input.my_class).delAttr("readonly");
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### setHidden
|
|
|
|
Ajoute l'attribut hidden aux éléments sélectionnés
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("span.my_class").setHidden();
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### setReadOnly
|
|
|
|
Ajoute l'attribut `readonly` aux éléments sélectionnés
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("input.my_class").setReadOnly();
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### setDisabled
|
|
|
|
Ajoute l'attribut `disabled` aux éléments sélectionnés
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("input.my_class").setDisabled();
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### delHidden
|
|
|
|
Supprime l'attribut `hidden` aux éléments sélectionnés
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("span.my_class").delHidden();
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### delReadOnly
|
|
|
|
Supprime l'attribut `readonly` aux éléments sélectionnés
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("input.my_class").delReadOnly();
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### delDisabled
|
|
|
|
Supprime l'attribut `disabled` aux éléments sélectionnés
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("input.my_class").delDisabled();
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### toggleHidden
|
|
|
|
switche l'attribut `hidden` des éléments sélectionnés
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("span.my_class").toggleHidden();
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### toggleReadOnly
|
|
|
|
switche l'attribut `readonly` des éléments sélectionnés
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("input.my_class").toggleReadOnly();
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### toggleDisabled
|
|
|
|
switche l'attribut `disabled` des éléments sélectionnés
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("input.my_class").toggleDisabled();
|
|
```
|
|
|
|
Returns **this** Chainage
|
|
|
|
### on
|
|
|
|
Ajoute un gestionnaire d'événement aux éléments sélectionnés
|
|
|
|
#### Parameters
|
|
|
|
* `type` **[String][69]** Nom de l'événement
|
|
* `callback` **[evtCallback][72]** Gestionnaire de l'événement
|
|
* `useCapture` **[Boolean][73]** Propagation de l'événement
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
$_("button#event").on("mouseover", (evt, el) => {
|
|
// Do something with evt and el
|
|
}, false);
|
|
```
|
|
|
|
### onClick
|
|
|
|
Ajout d'un gestionnaire d'événement 'click' pour les éléments sélectionnés
|
|
|
|
#### Parameters
|
|
|
|
* `callback` **[evtCallback][72]** Gestionnaire de l'événement
|
|
* `useCapture` **[Boolean][73]** 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é
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
let found = $_("#main").found();
|
|
```
|
|
|
|
Returns **[Boolean][73]** `true` si un élément au moins du DOM trouvé. `false` sinon
|
|
|
|
### first
|
|
|
|
Retourne le premier élément trouvé
|
|
|
|
#### Parameters
|
|
|
|
* `isHTMLElement` **[Boolean][73]** `true` pour obtenir un élément du DOM, `false` pour un Objet GSDom (optional, default `false`)
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
let htmlElement = $_("p.paragraphe").first(true);
|
|
```
|
|
|
|
```javascript
|
|
$_("input.my_class").first().setDisabled();
|
|
```
|
|
|
|
Returns **[HTMLElement][70]** l'élément du DOM trouvé
|
|
|
|
### last
|
|
|
|
Retourne le dernier élément trouvé
|
|
|
|
#### Parameters
|
|
|
|
* `isHTMLElement` **[Boolean][73]** `true` pour obtenir un élément du DOM, `false` pour un Objet GSDom (optional, default `false`)
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
let htmlElement = $_("p.paragraphe").last(true);
|
|
```
|
|
|
|
```javascript
|
|
$_("input.my_class").last().setDisabled();
|
|
```
|
|
|
|
Returns **([GSDom][74] | [HTMLElement][70])** L'élément du DOM trouvé ou un Objet GSDom correspondant pour chainage
|
|
|
|
### items
|
|
|
|
Retourne un tableau des éléments du Dom sélectionnés
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
let my_HTMLElements = $_("p.my_class").items();
|
|
```
|
|
|
|
Returns **[Array][75]<[HTMLElement][70]>** les éléments du DOM sélectionnés
|
|
|
|
### count
|
|
|
|
Retourne le nombre d'éléments du DOM sélectionnés
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
let count = $_("p.my_class").count();
|
|
```
|
|
|
|
### itemAtIndex
|
|
|
|
Retourne l'élément à l'index `index` parmi les éléments sélectionnés;
|
|
|
|
#### Parameters
|
|
|
|
* `index` **[Number][76]** Index de l'élément souhaité
|
|
* `isHTMLElement` **[Boolean][73]** `true` pour obtenir un élément du DOM, `false` pour un Objet GSDom (optional, default `false`)
|
|
|
|
#### Examples
|
|
|
|
```javascript
|
|
let htmlElement = $_("p.paragraphe").itemAtIndex(2,true);
|
|
```
|
|
|
|
```javascript
|
|
$_("input.my_class").itemAtIndex(2).setDisabled();
|
|
```
|
|
|
|
Returns **([GSDom][74] | [HTMLElement][70])** L'élément du DOM trouvé ou un Objet GSDom correspondant pour chainage
|
|
|
|
### version
|
|
|
|
Retourne la version de la bibliothèque
|
|
|
|
#### Parameters
|
|
|
|
* `long` **[Boolean][73]** `true` pour obtenir la version longue
|
|
|
|
Returns **[String][69]** Le numéro de version
|
|
|
|
## eachCallback
|
|
|
|
* **See**: [each][4]
|
|
|
|
Fonction de rappel la méthode each()
|
|
|
|
Type: [Function][77]
|
|
|
|
### Parameters
|
|
|
|
* `element` **[HTMLElement][70]** L'élément du DOM concerné
|
|
* `index` **[number][76]** L'index de l'élément
|
|
|
|
## evtCallback
|
|
|
|
* **See**: [on][42]
|
|
* **See**: [onClick][45]
|
|
|
|
Fonction de rappel des méthodes on() et onClick()
|
|
|
|
Type: [Function][77]
|
|
|
|
### Parameters
|
|
|
|
* `evt` **[Event][78]** L'événement qui s'est produit
|
|
* `item` **[HTMLElement][70]** L'élément du DOM concerné par lévénement
|
|
|
|
[1]: #gsdom
|
|
|
|
[2]: #parameters
|
|
|
|
[3]: #examples
|
|
|
|
[4]: #each
|
|
|
|
[5]: #parameters-1
|
|
|
|
[6]: #examples-1
|
|
|
|
[7]: #addclass
|
|
|
|
[8]: #parameters-2
|
|
|
|
[9]: #examples-2
|
|
|
|
[10]: #removeclass
|
|
|
|
[11]: #parameters-3
|
|
|
|
[12]: #examples-3
|
|
|
|
[13]: #removeallclasses
|
|
|
|
[14]: #examples-4
|
|
|
|
[15]: #replaceclass
|
|
|
|
[16]: #parameters-4
|
|
|
|
[17]: #examples-5
|
|
|
|
[18]: #setattr
|
|
|
|
[19]: #parameters-5
|
|
|
|
[20]: #examples-6
|
|
|
|
[21]: #delattr
|
|
|
|
[22]: #parameters-6
|
|
|
|
[23]: #examples-7
|
|
|
|
[24]: #sethidden
|
|
|
|
[25]: #examples-8
|
|
|
|
[26]: #setreadonly
|
|
|
|
[27]: #examples-9
|
|
|
|
[28]: #setdisabled
|
|
|
|
[29]: #examples-10
|
|
|
|
[30]: #delhidden
|
|
|
|
[31]: #examples-11
|
|
|
|
[32]: #delreadonly
|
|
|
|
[33]: #examples-12
|
|
|
|
[34]: #deldisabled
|
|
|
|
[35]: #examples-13
|
|
|
|
[36]: #togglehidden
|
|
|
|
[37]: #examples-14
|
|
|
|
[38]: #togglereadonly
|
|
|
|
[39]: #examples-15
|
|
|
|
[40]: #toggledisabled
|
|
|
|
[41]: #examples-16
|
|
|
|
[42]: #on
|
|
|
|
[43]: #parameters-7
|
|
|
|
[44]: #examples-17
|
|
|
|
[45]: #onclick
|
|
|
|
[46]: #parameters-8
|
|
|
|
[47]: #examples-18
|
|
|
|
[48]: #found
|
|
|
|
[49]: #examples-19
|
|
|
|
[50]: #first
|
|
|
|
[51]: #parameters-9
|
|
|
|
[52]: #examples-20
|
|
|
|
[53]: #last
|
|
|
|
[54]: #parameters-10
|
|
|
|
[55]: #examples-21
|
|
|
|
[56]: #items
|
|
|
|
[57]: #examples-22
|
|
|
|
[58]: #count
|
|
|
|
[59]: #examples-23
|
|
|
|
[60]: #itematindex
|
|
|
|
[61]: #parameters-11
|
|
|
|
[62]: #examples-24
|
|
|
|
[63]: #version
|
|
|
|
[64]: #parameters-12
|
|
|
|
[65]: #eachcallback
|
|
|
|
[66]: #parameters-13
|
|
|
|
[67]: #evtcallback
|
|
|
|
[68]: #parameters-14
|
|
|
|
[69]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String
|
|
|
|
[70]: https://developer.mozilla.org/docs/Web/HTML/Element
|
|
|
|
[71]: #eachcallback
|
|
|
|
[72]: #evtcallback
|
|
|
|
[73]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean
|
|
|
|
[74]: #gsdom
|
|
|
|
[75]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array
|
|
|
|
[76]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number
|
|
|
|
[77]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function
|
|
|
|
[78]: https://developer.mozilla.org/docs/Web/API/Event
|