Add to favourites image?

[jamjam]

Hi

I am complete javascrpt newbie, I have this script. Not my work.

function fav() {
var newT = document.createTextNode('Add to Favourites');
var s = document.getElementById('fav');
if (window.sidebar) {
s.appendChild(newT);
s.style.cursor = 'pointer';
s.onclick = function() {window.sidebar.addPanel(document.title,self.location,'')};
} else if (window.external) {
s.appendChild(newT);
s.style.cursor = 'pointer';
s.onclick = function() {window.external.AddFavorite(self.location,document.title)};
} else if (window.opera) {
s.appendChild(newT);
s.style.cursor = 'pointer';
s.onclick = function() {
var e = document.createElement('a');
e.setAttribute('href',self.location);
e.setAttribute('title',document.title);
e.setAttribute('rel','sidebar');
e.click();
  }
}
}
var pageLoaded = 0;
window.onload = function() {pageLoaded = 1;}
function loaded(i,f) {
if (document.getElementById && document.getElementById(i) != null) f();
else if (!pageLoaded) setTimeout('loaded(\''+i+'\','+f+')',100);
}
loaded('fav',fav);

The script adds a add to favourites link to a page.

This works without any problems.

My intention is to adapt the script so instead of outputting a link(text) it outputs a image.

But I don't how to do this.

Please help. Thanks

[johanafm]

The code does in fact not add a link at all. In the opera case, a link is indeed created, and subsequently clicked, but that link is still never added to the document. So it would make more sense to keep the text "Add to favourites" in the html code. That's also where you should put your image.

function fav() {
	/* A text node is created, and later on added as a child of s.
	But since s seems to always be there, why not have the text in s
	from the beginning? I.e. in the html code */
	var newT = document.createTextNode('Add to Favourites');

/* Instead of creating and adding a text node to s, you could create and add an image.
But once again, it would make more sense to have this done in the html code
	var img = document.createElement('img');
	img.src = "";		// and whatever else you need to set
	s.appendChild(img);
*/

// s allready exists, it is NOT added.
var s = document.getElementById('fav');

/* These two lines of code were executed in all if/else branches, which means this
code is non-conditional and should not be inside if/else blocks */
s.style.cursor = 'pointer';
s.appendChild(newT);		// This is where the text node is added to s

/* And suddenly it's clear that the only thing that differs is how to add a bookmark
	in different browsers */
if (window.sidebar)
{
	s.onclick = function() {window.sidebar.addPanel(document.title,self.location,'')};
} else if (window.external)
{
	s.onclick = function() {window.external.AddFavorite(self.location,document.title)};
} else if (window.opera)
{
	s.onclick = function() {
		var e = document.createElement('a');
		e.setAttribute('href',self.location);
		e.setAttribute('title',document.title);
		e.setAttribute('rel','sidebar');
		e.click();
	}
}
}