Question

I am looking for the best way to insert an image with greasmonkey into a href. The picture should be there where now the text (??????) is.

   // ==UserScript==
   // @name           ...
   // @description    ...
   // @include        http://website/
   // @version        1.0
   // ==/UserScript==
    var links = document.getElementsByClassName( 'xyz' );
    for ( var i = 0; i < links.length; i++ ) {
    var link = links[i];
    var newlink = document.createElement( 'a' );
    newlink.href = link.href.replace( 'value=10', 'value=20' );

    newlink.textContent = '??????';

    var nextNode = link.nextSibling;
    link.parentNode.insertBefore( newlink, nextNode );
    var delim = document.createTextNode( ' - ' );
    link.parentNode.insertBefore( delim, newlink );
    }

Thank you all for the help.

Answer 1

var links = document.getElementsByClassName( 'xyz' );
for ( var i = 0; i < links.length; i++ ) {
    var link = links[i];
    var newlink = document.createElement( 'a' );
    newlink.href = link.href.replace( 'value=10', 'value=20' );
    var the_image = document.createElement('img');
    the_image.src = '';//Place image source file path here
    newlink.appendChild(the_image);

    var nextNode = link.nextSibling;
    link.parentNode.insertBefore( newlink, nextNode );
    var delim = document.createTextNode( ' - ' );
    link.parentNode.insertBefore( delim, newlink );
}