Twilo: src einer bestimmten Grafik ändern

Hallo,

mit
document.images[0].src = 'xyz.gif';
ändrt man ja den src der ersten Grafik im HTML Dokument.
ich möchte aber den src einer bestimmten Grafik ändern, diese Grafik kann mal an 2, 3, etc. Stelle sein

kann ich dann den src der Grafik über getElementByID ändern?
document.getElementByID('bildxxx').src = 'xyz.gif';

auf Selfhtml find ich leider nix darüber
http://www.selfhtml.net/javascript/objekte/images.htm#src

mfg
Twilo

  1. Hallo,

    mit
    document.images[0].src = 'xyz.gif';
    ändrt man ja den src der ersten Grafik im HTML Dokument.
    ich möchte aber den src einer bestimmten Grafik ändern, diese Grafik kann mal an 2, 3, etc. Stelle sein

    Wenn die Grafik ein name-Attribut hat, funktioniert auch document.images["bildname"] bzw. document.images.bildname bzw. document.bildname.

    kann ich dann den src der Grafik über getElementByID ändern?
    document.getElementByID('bildxxx').src = 'xyz.gif';

    Ja, das geht. Du musst nur auf die richtige Schreibweise achten, nicht »ID«, sondern »Id« am ende.

    auf Selfhtml find ich leider nix darüber
    http://www.selfhtml.net/javascript/objekte/images.htm#src

    document.getElementById ist hier beschrieben: http://de.selfhtml.org/javascript/objekte/document.htm#get_element_by_id
    Hier findest du ein Beispiel, wie mit document.getElementById das src-Attribut einer Grafik geändert wird: http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#img

    Mathias

    1. Hallo,

      mit
      document.images[0].src = 'xyz.gif';
      ändrt man ja den src der ersten Grafik im HTML Dokument.
      ich möchte aber den src einer bestimmten Grafik ändern, diese Grafik kann mal an 2, 3, etc. Stelle sein

      Wenn die Grafik ein name-Attribut hat, funktioniert auch document.images["bildname"] bzw. document.images.bildname bzw. document.bildname.

      laut Validator unter XHTML 1.0 strict nicht zugelassen :-)
      das hatte ich schon probiert, bekam aber gleich eins auf die Finger *g*

      kann ich dann den src der Grafik über getElementByID ändern?
      document.getElementByID('bildxxx').src = 'xyz.gif';

      Ja, das geht. Du musst nur auf die richtige Schreibweise achten, nicht »ID«, sondern »Id« am ende.

      der Fehler passiert mir öfters, ka warum :-/

      auf Selfhtml find ich leider nix darüber
      http://www.selfhtml.net/javascript/objekte/images.htm#src

      document.getElementById ist hier beschrieben: http://de.selfhtml.org/javascript/objekte/document.htm#get_element_by_id
      Hier findest du ein Beispiel, wie mit document.getElementById das src-Attribut einer Grafik geändert wird: http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#img

      warum hab ich das eigentlich nicht selbe gefunden?

      funktionieren tut es aber prima :-)

      mfg
      Twilo

      1. Hallo,

        Wenn die Grafik ein name-Attribut hat, funktioniert auch document.images["bildname"] bzw. document.images.bildname bzw. document.bildname.
        laut Validator unter XHTML 1.0 strict nicht zugelassen :-)
        das hatte ich schon probiert, bekam aber gleich eins auf die Finger *g*

        Du kannst aber trotzdem mit der document.images-Collection arbeiten. Gib dem IMG-Element eine ID und nutze

        document.images.namedItem("BildID")

        Das document.getElementById ist hierfür viel zu unperformant, da es ja die images-Collection ohnehin gibt.

        http://www.w3.org/TR/1998/WD-DOM-19980720/level-one-html.html
        ...
        interface HTMLDocument : Document {
                   attribute  wstring              title;
          readonly attribute  wstring              referrer;
          readonly attribute  wstring              fileSize;
          readonly attribute  wstring              fileCreatedDate;
          readonly attribute  wstring              fileModifiedDate;
          readonly attribute  wstring              fileUpdatedDate;
          readonly attribute  wstring              domain;
          readonly attribute  wstring              URL;
                   attribute  HTMLElement          body;
          readonly attribute  HTMLCollection       images;
          readonly attribute  HTMLCollection       applets;
          readonly attribute  HTMLCollection       links;
          readonly attribute  HTMLCollection       forms;
          readonly attribute  HTMLCollection       anchors;
                   attribute  wstring              cookie;
          void                      open();
          void                      close();
          void                      write(in wstring text);
          void                      writeln(in wstring text);
          Element                   getElementById(in wstring elementId);
          NodeList                  getElementsByName(in wstring elementName);
        };
        ...

        interface HTMLCollection {
          readonly attribute  long                 length;
          Node                      item(in long index);
          Node                      namedItem(in wstring name);
        };
        ...

        namedItem
        This method retrieves a Node using a name.

        Parameters
        name  The name of the Node to be fetched.

        Return Values
        The Node with a name or id attribute whose value corresponds to the specified string. Upon failure (e.g., no Node with this name exists), returns null.

        This method raises no exceptions.

        viele Grüße

        Axel

        1. document.images.namedItem("BildID")

          Man kann auch in XHTML 1.0 Strict document.images["bildname"] zusammen mit einem ID-Attribut verwenden, namedItem ist in DOM 2 HTML äquivalent zur []-Notation. Bei »echtem« XHTML funktioniert document.images.bildname ebenso im Gecko, Konqueror und Opera.

          Mathias