Différentes façons d’accéder aux objets d’image JavaScript

Il s’agit d’un atelier JavaScript qui est également encadré dans le manuel de traitement d’image JavaScript. Nous apprendrons à obtenir des objets d’image JavaScript, que nous pouvons ensuite utiliser pour ce que nous voulons.

Nous allons montrer plusieurs des moyens que nous devons faire cette étape, d’autres plus généraux et évidents et autres plus spécifiques déterminés environnements de travail. En fin de compte, nous avons toujours la même chose, une variable qui a à l’intérieur d’un objet image.

Créer une image à partir de JavaScript Code

La manière la plus directe est de créer votre objet image (objet d’image JavaScript) Instance Un objet de l’image image, de cette manière:

var objimagen = nouvelle image ();

puis nous pourrions affecter des valeurs aux différentes propriétés de l’objet image, pour la configurer. Par exemple:

img.src = ‘image-développementwebcom.gif’;

Obtenez l’objet Image d’une image de la page

Si nous le souhaitons, nous pouvons obtenir L’objet image par l’une des images de la page où nous travaillons, c’est-à-dire une seule étiquette IMG du document HTML actuel.

Pour cela, nous pouvons accéder à cet élément avec un document.getElementyID (), indiquant l’identifiant (ID d’attribut) de l’image que nous voulons.

var img = document.getelementbyid (« IM1 ») ;

Cela récupérerait l’objet IMAG IMG associé à la balise IMG qui a l’identifiant.

Nous pouvons également accéder à l’une des images sur la matrice d’image, « Images », IT dépend de l’objet de document.

var img = document.images;

avec cela, nous obtenons l’objet image de la deuxième balise IMG sur la page.

Obtenez l’image de l’objet par Données: URL

Autre méthode consiste à utiliser une image exprimée sous forme de chaîne de caractères codée de base64, dans un schéma appelé Data: URL.

var img = nouvelle image ();
IMG.SRC = ‘ Données: image / gif; base64, r0lgodlhcwalaaaaaaaa2pn / zih5baeaaaaalaaaaaaaaaaaaiaaaaaaaaasaaaiuha + hkcuo4lmnvindo7qyrixigbyow == ‘;

Remarque: pensez à la différence entre enregistrer l’enregistrement de l’image dans un fichier graphique et la sauvegarder sur une chaîne de caractères dans votre code JavaScript. Il y a deux variantes radicalement différentes et ont donc différentes particularités. L’avantage est que vous ne devez pas faire connecter le serveur pour apporter ces images et que nous n’aurons pas besoin de les préparent. L’inconvénient est que les images ne sont pas capturées et que si elles sont très grandes, elles génèrent un code très long.

avec le code précédent, nous aurions un objet d’image à partir d’une chaîne de texte. L’image est petite, le code de l’image est donc aussi court.

Ce format de données: URL n’est pas disponible dans tous les navigateurs, bien que le plus moderne le soutenait, tels que Firefox, Chrome, Opera ou Internet Explorateur de la version 8.

Pour savoir si votre navigateur est compatible avec ce format, placez ce code:

document.images.src = ‘Données: image / gif; base64, r0lgodlhcwalaiaaaaaaa2pn / ZIH5BAEAAAAAAAAAALAASAAAIAAAAAAAAASAAAIAUHA + HKCUO4LMNVINDO7QYRIXIGBYOW == ‘;

Ceci modifie l’attribut SRC de la première étiquette IMG de la page et modifiera donc l’image visible dans le navigateur. De toute évidence, nous devrons avoir une image quelque part sur la page afin que cette instruction fonctionne.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *