/    Sign up×
Community /Pin to ProfileBookmark

any javascript to load image..

Copy linkTweet thisAlerts:
Nov 07.2010

i have been given some conversion tracking code like so…

<img width=”1″ height=”1″ src=”http://main.tracking.com/tag.php?goal=06a15eb1c37367“>

but have been told the website i work on will only use javascript tracking code.

my question is, is there a way of having a piece of javascript code do the same job as this code?

i am guessing if the javascript can load this image on the page some how it will track the conversions.. i know this is tricky but any pointers would be great.

to post a comment
JavaScript

8 Comments(s) ↴

Copy linkTweet thisAlerts:
@KorNov 08.2010 — A conversion tracking code is useful for a third part to know how many times an image was clicked and from where. That process needs a [I]server-side[/I] counter, or JavaScript is a [I]client-side[/I] language.

I see you are a little bit confused about the terms:

if the javascript can [COLOR="Red"]load[/COLOR] this image on the page
[/quote]
It is not JavaScript which loaded the image, it is the browser which do that, along with the whole document, via a HTTP protocol sent data, and based on the HTML language interpreter. JavaScript can, maybe, modify locally the HTML structure by creating/changing/removing an element IMG and his attributes. Anyway, everything what JavaScript can do is kept at a client level and "dies" when the session is changed. A tracking process needs a server to store the tracking, thus a database and a server-side language.

So, what in fact is your aim? I confess I did not understand. Can you detail?
Copy linkTweet thisAlerts:
@dalesullyauthorNov 08.2010 — hi sorry if i confused you but all i was asking was if JavaScript can load an image on a page.

i was given this tracking code to use but unfortunately can't use it as it is not in JavaScript...

<img width="1" height="1" src="http://main.tracking.com/tag.php?goal=06a15eb1c37367">

Only javascript can be used on this website i am working on so needed to load this image using JavaScript.. but have been told that it is possible to get around this problem using something like..

<script type="text/javascript">

document.write('<img width="1" height="1" src="http://main.tracking.com/tag.php?goal=06a15eb1c37367" />');

</script>

hopefully it works!
Copy linkTweet thisAlerts:
@KorNov 08.2010 — 
1.

<img width="1" height="1" src="http://main.tracking.com/tag.php?goal=06a15eb1c37367">

2.

<script type="text/javascript">

document.write('<img width="1" height="1" src="http://main.tracking.com/tag.php?goal=06a15eb1c37367" />');

</script>

[/QUOTE]
Now I am much more confused. And what's the difference? What makes you believe the second one works, and the first one does not? Of course, as I said, you may [I]create[/I] an element on using javascript (not [I]to load[/I] - that is a wrong term), but, technically, it is the same thing as you would have written it straight in HTML from the beginning.
Copy linkTweet thisAlerts:
@dalesullyauthorNov 08.2010 — just thought i would report back.. and seems to be tracking ok so alls well.. been told that this may also work if anyone has the same problem as me..

<script type="text/javascript">

var img = document.createElement('img');

img.height = img.width = 1;

img.src = 'http://main.tracking.com/tag.php?goal=06a15eb1c37367';

document.getElementById('wrapper').appendChild(img);

</script>

or this

<script type="text/javascript">

document.write('<img width="1" height="1" src="http://main.tracking.com/tag.php?goal=06a15eb1c37367" />');

</script>
Copy linkTweet thisAlerts:
@KorNov 08.2010 — maybe:
<i>
</i>[B][COLOR="Blue"]onload=function(){[/COLOR][/B]
var img = document.createElement('img');
img.style.height='1px';
img.style.width='1px';
img.src = 'http://main.tracking.com/tag.php?goal=06a15eb1c37367';
document.getElementById('wrapper').appendChild(img);
[COLOR="Blue"][B]}[/B][/COLOR]


You can not refer an element (the "wrapper") before it was loaded and added to the DOM tree. So you should trigger the code[B] onload[/B].
Copy linkTweet thisAlerts:
@dalesullyauthorNov 08.2010 — ok, i don't know JavaScript but is it possible to do away with the wrapper part. not sure if i need it.. also would there be loading/browser issues as this might not be good for the tracker?

i will see if it works anyway but taking everything into consideration, in your opinion, would this be better than the other way..

thanks..
Copy linkTweet thisAlerts:
@dalesullyauthorNov 08.2010 — i.e this

<script type="text/javascript">

onload=function(){

var img = document.createElement('img');

img.style.height='1px';

img.style.width='1px';

img.src = 'http://main.tracking.com/tag.php?goal=06a15eb1c37367';

document.getElementById('wrapper').appendChild(img);

}

</script>

or this

<script type="text/javascript">

document.write('<img width="1" height="1" src="http://main.tracking.com/tag.php?goal=06a15eb1c37367" />');

</script>
Copy linkTweet thisAlerts:
@KorNov 08.2010 — Both do the same. The only difference is that the first method writes the element after all the DOM tree was loaded (and the code can be placed within the head of the document), while the second do that in run time(and the code [I]must[/I] be placed within the "wrapper" element).
×

Success!

Help @dalesully spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...