Inserting Javascript into HTML Javascript

Question

I'm trying to insert this Javascript code via. Google:

<script type='text/javascript'>
googletag.cmd.push(function() { googletag.display('div-gpt-ad-1362706866260-0'); });
</script>

into this JavaScript / HTML code:

var theDivs = {
      "div1": makeSpecialBox("doublearticlewrapperadmp", 
              '<div class="articlewrapper" id="div-gpt-ad-1362706866260-0">
              <div class="entry-image"></div></div>'),
      ...
};

I'd like to insert the first code listed above between my "entry-image" div. I tried simply doing this:

var theDivs = {
      "div1": makeSpecialBox("doublearticlewrapperadmp", 
'<div class="articlewrapper" id="div-gpt-ad-1362706866260-0">
<div class="entry-image">googletag.cmd.push(function() { googletag.display('div-gpt-ad-1362706866260-0'); });</div></div>'),

Adding the straight up javascript code from Google within my HTML part of my javascript code simply does not work, with or without the script tags :( How would I go around this issue and correctly insert my above Google javascript code into my existing code?

Updated Current Code:

<script type="text/javascript">
$(document).ready(function () {
var $window = $(window);
var resized = false;
var resized500 = false;
var resized600 = false;
var resized700 = false;
var resized800 = false;

var sadfdsf = true;
var theDivs = {
        "div1": makeSpecialBox("doublearticlewrapperadmp", '<div class="articlewrapper" id="div-gpt-ad-1362706866260-0"><div class="entry-image"><script type="text/javascript">googletag.cmd.push(function() { googletag.display("div-gpt-ad-1362706866260-0"); });</script></div></div>'),

        "div2": makeSpecialBox("doublearticlewrapperadmp", '<div class="articlewrapper"></div></div>'),

        "div3": makeSpecialBox("doublearticlewrapperadmp", '<div class="articlewrapper"></div></div>'),

        "div4": makeSpecialBox("doublearticlewrapperadmp", '<div class="articlewrapper"></div></div>'),

        "div5": makeSpecialBox("doublearticlewrapperadmp", '<div class="articlewrapper"></div></div>'),

function makeSpecialBox(className, content) {
    // Create a new special box with the class name and the content
    var specialBox = $("<div />").addClass(className).html(content);
    // Return the special box
    return specialBox;
}

function removeSpecialBoxes() {
    // Get the special boxes
    var specialBoxes = $("#wrapper div").filter("[class^=doublearticlewrapperadmp]");
    // Remove the special boxes
    specialBoxes.remove();
}

function setNthPosition(theDiv, newPos) {
    // Generate the special box
    var theClone = theDivs["div" + theDiv].clone();
    // Get the nth-child
    var nthChild = $("#wrapper > div:nth-of-type(" + newPos + ")");
    // Append the special box after the nth-child
    nthChild.after(theClone);
}

function checkWidth() {
    var windowsize = $window.width();
    if (windowsize >= 1442) {
        //if the window is in between the sizes of 440 and 500px
        //if(resized==false){
        // Remove special boxes
        removeSpecialBoxes();
        // Reposition
        setNthPosition(1, 9);
        setNthPosition(2, 15);
        setNthPosition(3, 29);
        setNthPosition(4, 35);
        resized = true;
        //  }
    }

    windowsize = $window.width();
    if (windowsize > 1278 && windowsize < 1441)  {
        //if the window is in between the sizes of 500 and 600px
        // if(resized500==false){
        // Remove special boxes
        removeSpecialBoxes();
        // Reposition
        setNthPosition(1, 7);
        setNthPosition(2, 16);
        setNthPosition(3, 31);
        setNthPosition(4, 40);
        resized500 = true;

        // }
    }

    if (windowsize < 1278) {
        //if the window is in between the sizes of 600 and 700px
        // if(resized600==false){
        // Remove special boxes
        removeSpecialBoxes();
        // Reposition
        setNthPosition(1, 5);
        setNthPosition(2, 15);
        setNthPosition(3, 29);
        setNthPosition(4, 39);
        resized600 = true;

        //}
    }
}

// Execute on load
checkWidth();
// Bind event listener
$(window).resize(checkWidth);
});

`

Community · Accepted Answer · 2017-05-23 12:04:53Z

1

You forgot your script tags:

var theDivs = {
  "div1": makeSpecialBox("doublearticlewrapperadmp", 
  '<div class="articlewrapper" id="div-gpt-ad-1362706866260-0">
  <div class="entry-image"><script type="text/javascript">googletag.cmd.push(function() { googletag.display("div-gpt-ad-1362706866260-0"); });</script></div></div>'),

Also be aware of your usage of single/double quotes. Some may or may not need escaping too (although it seems like you won't need to...), but I did change the single quotes to double quotes around in the googletag.display("div-gpt-ad-1362706866260-0") part.

EDIT:

You might find your solution here: Script tag in JavaScript string

var test = '...... </scr'+'ipt>......';

That little trick might be able to get around the browser parsing your tag.

So in your case:

var theDivs = {
  "div1": makeSpecialBox("doublearticlewrapperadmp", 
  '<div class="articlewrapper" id="div-gpt-ad-1362706866260-0">
  <div class="entry-image"><script type="text/javascript">googletag.cmd.push(function() { googletag.display("div-gpt-ad-1362706866260-0"); });</scr' + 'ipt></div></div>'),

edited May 23, 2017 at 12:04

CommunityBot

11 silver badge

answered Mar 8, 2013 at 2:04

Jace

3,0722 gold badges24 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Dyck Over a year ago

I edited my question, it does not work, with or without the script tags :(

Jace Over a year ago

Did you check your quotes? I also editted the single quotes you had inside your javascript

Jace Over a year ago

googletag.display('div-gpt-ad-1362706866260-0'); --> googletag.display("div-gpt-ad-1362706866260-0");

Jace Over a year ago

What is actually happening? What is the output?

Dyck Over a year ago

The end script code for the google ads is ending my inital javacsript code in which the ad code is being placed in. So I have an opening javascript code and then within that i have my google ads code, with the closing '</script>'. And that closing script code closes my initial javacsript code all together causing everything to break. I hope that makes sense. :)

|

Collectives™ on Stack Overflow

Inserting Javascript into HTML Javascript

1 Answer 1

8 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

8 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related