Soy muy nuevo en Javascript, estoy haciendo un sitio web HTML.

Ya que soy nuevo en Javascript, no sé cómo mostrar una imagen, y cuando se hace clic en la imagen hacen que sea un enlace a una página.

Sé cómo hacerlo en HTML, pero debido a mi host gratuito si no era para hacer un único cambio en la cantidad de imágenes que hay (que voy a hacer un montón), o donde los enlaces (que se muestra en cada página) tendré que ir a través de cada página.

Todo lo que necesitas hacer es abrir la página en la misma ficha.

  • Si usted tiene algún código de mostrar
  • Lo mínimo html ¿tiene (lo suficiente como para demostrar su problema-page), y en qué evento quieres agregar nuevos html con JavaScript? Y lo que precisa html ¿desea agregar?
  • Enlaces sobre ser Una de las etiquetas, no en imágenes de sí mismos. Es una buena forma.
InformationsquelleAutor Guy Keogh | 2013-06-11

2 Comentarios

  1. 7

    Intente esto:

    var img = new Image();
    img.src = 'image.png';
    img.onclick = function() {
        window.location.href = 'http://putyourlocationhere/';
    };
    document.body.appendChild(img);
  2. 2

    Sin más información, voy a ofrecer esto como un relativamente cruz-enfoque de navegador, que añadirá un img elemento envuelto en un a elemento. Esto funciona con los siguientes (simple) HTML:

    <form action="#" method="post">
        <label for="imgURL">image URL:</label>
        <input type="url" id="imgURL" />
        <label for="pageURL">page URL:</label>
        <input type="url" id="pageURL" />
        <button id="imgAdd">add image</button>
    </form>

    Y el siguiente JavaScript:

    //a simple check to *try* and ensure valid URIs are used:
    function protocolCheck(link) {
        var proto = ['http:', 'https:'];
    
        for (var i = 0, len = proto.length; i < len; i++) {
            //if the link begins with a valid protocol, return the link
            if (link.indexOf(proto[i]) === 0) {
                return link;
            }
        }
    
        //otherwise assume it doesn't, prepend a valid protocol, and return that:
        return document.location.protocol + '//' + link;
    }
    
    function createImage(e) {
        //stop the default event from happening:
        e.preventDefault();
        var parent = this.parentNode;
    
        /* checking the protocol (calling the previous function),
           of the URIs provided in the text input elements: */
        src = protocolCheck(document.getElementById('imgURL').value);
        href = protocolCheck(document.getElementById('pageURL').value);
    
        //creating an 'img' element, and an 'a' element
        var img = document.createElement('img'),
            a = document.createElement('a');
    
        //setting the src attribute to the (hopefully) valid URI from above
        img.src = src;
    
        //setting the href attribute to the (hopefully) valid URI from above
        a.href = href;
        //appending the 'img' to the 'a'
        a.appendChild(img);
        //inserting the 'a' element *after* the 'form' element
        parent.parentNode.insertBefore(a, parent.nextSibling);
    }
    
    var addButton = document.getElementById('imgAdd');
    
    addButton.onclick = createImage;

    JS Violín demo.

Dejar respuesta

Please enter your comment!
Please enter your name here