Solved

How to inject 3rd party image tags into container iframe after page load?

Posted on 2016-11-03
5
76 Views
Last Modified: 2016-11-04
I'm trying to fire of static marketing pixels in an iframe based on a condition, after the page has loaded but I can't get it to work? I get the following error on line 12:  Uncaught TypeError: Cannot read property 'parentNode' of undefined
var sTags = ['<img src="https://ad.doubleclick.net/ddm/activity/src=4587700;type=oao;cat=im_oaoc;u11=[URL];u12=[New vs Returning];ord=[Random Number]?" />',
             '<img src="https://ad.doubleclick.net/ddm/activity/src=4587707;type=oao;cat=im_oaoc;u11=[URL];u12=[New vs Returning];ord=[Random Number]?" />', 
             '<img src="https://ad.doubleclick.net/ddm/activity/src=4587777;type=oao;cat=im_oaoc;u11=[URL];u12=[New vs Returning];ord=[Random Number]?" />']           
for(var i=0; i<sTags.length; i++) {
    var iframeTag = document.createElement("iframe");
    iframeTag.setAttribute("width", "1");
    iframeTag.setAttribute("height", "1");
    iframeTag.style.display = "none";
    iframeTag.style.border = "none";
    iframeTag.src = sTags[i];
    var ref = document.getElementsByTagName("img")[0];
    ref.parentNode.insertBefore(iframeTag, ref);
}

Open in new window

So not sure what I'm doing wrong or how I accomplish this?

Thanks!
0
Comment
Question by:894359
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
5 Comments
 
LVL 22

Expert Comment

by:Kim Walker
ID: 41873437
You're setting the src attribute of the new iframe to an <img> tag? The src of an iframe should be a URL.

Do you have any <img> tags on the page? document.getElementsByTagName("img")[0] looks for the first <img> tag on the page. Afterward it will insert the new iFrame with the questionable src attribute in front of it. If there aren't any <img> tags on the page, it will be empty. Hence the error "Cannot read property 'parentNote' of undefined."
0
 
LVL 56

Expert Comment

by:Julian Hansen
ID: 41873462
I'm trying to fire of static marketing pixels in an iframe based on a condition
Why do you want to do this in an iframe? What advantage does that have over a div on the page?
0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
ID: 41873710
here how to put three images in an iframe and add this iframe to current document at page load:
<script>
    window.onload = function() {
        var sTags = ['http://path/to/img/1','http://path/to/img/2','http://path/to/img/3'];

        var iframeTag = document.createElement("iframe");
        iframeTag.setAttribute("width", "1");
        iframeTag.setAttribute("height", "1");
        iframeTag.style.display = "none";
        iframeTag.style.border = "none";

        for(var i=0; i<sTags.length; i++) {
            var imgTag = document.createElement("img");
            imgTag.src = sTags[i];
            iframeTag.appendChild(imgTag);
        }

        document.body.appendChild(iframeTag);    
    }
</script>

Open in new window

0
 

Author Comment

by:894359
ID: 41874387
Hi Leakim,
I'll try your solution but it must work after the page loads, so I'll try and see .

Thanks,
MJ

Julian,
I thought it would be more secure using an iframe?

Thanks,
MJ
0
 
LVL 56

Expert Comment

by:Julian Hansen
ID: 41874481
I thought it would be more secure using an iframe?
Secure against what exactly?
0

Featured Post

Creating Instructional Tutorials  

For Any Use & On Any Platform

Contextual Guidance at the moment of need helps your employees/users adopt software o& achieve even the most complex tasks instantly. Boost knowledge retention, software adoption & employee engagement with easy solution.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
need help with share buttons 11 72
Passing client data from form to server 5 23
Session on Html 8 42
How do I split a variable to newline 2 19
Any business that wants to seriously grow needs to keep the needs and desires of an international audience of their websites in mind. Making a website friendly to international users isn’t prohibitively expensive and can provide an incredible return…
There’s a good reason for why it’s called a homepage – it closely resembles that of a physical house and the only real difference is that it’s online. Your website’s homepage is where people come to visit you. It’s the family room of your website wh…
This tutorial demonstrates how to identify and create boundary or building outlines in Google Maps. In this example, I outline the boundaries of an enclosed skatepark within a community park.  Login to your Google Account, then  Google for "Google M…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

726 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question