How to insert <script> with Prototype?

Question

I'm using Prototype insert function to appent some html which contains <script>...</script>. And within this script I'm defining a new function. And as I read here Prototype runs script that is inside <script> tags and then removes it, but all functions should remain accessible. But from that moment I can't run my new function.

 $('some_id').insert({ bottom: '<script> ... </script>' });

How to solve it? The best would be that it won't remove <script> tags.

EDIT:

By now I did it like this:

var add_here = document.getElementById('prepayment_group_items');
var src = document.createElement('div');
src.innerHTML = 'a lot of html with script tags';
add_here.appendChild(src);

You might want to include the script you are trying to execute in your example. Also, you might try adding: type="text/javascript" to your script element. — cjstehno
– cjstehno, Commented Jan 15, 2010 at 22:11
Script contains something like: function update_38172() {...}. Where this number is generated by Rails. This function works when I add to this script: update_38172(); it run, but only once. After inserting is finished <script> part is completly removed from html. — klew
– klew, Commented Jan 15, 2010 at 22:28

pib · Accepted Answer · 2010-01-16 03:00:41Z

2

This function will add a script tag to the head of the page, with whatever content you pass it.

function insertScript(script_text) {
    var script_tag = document.createElement('script');
    script_tag.type = "text/javascript";

    var script = document.createTextNode(script_text);
    script_tag.appendChild(script);

    document.getElementsByTagName('head')[0].appendChild(script_tag);
}

I'm more familiar with jQuery than Prototype, so I just did this in pure JS.

Translate the part where I create the element and the part where I get the HEAD element into Prototype if you want, but use the call to appendChild instead of Prototype's insert function, since it will just do what you ask, rather than eval-ing the JS.

Of course, now that I look at what you're asking for, you might also just try changing the code you're inserting to something like:

window.update_12345 = function() {...}

I'm not sure if that will fit it or not, but it's worth a try.

answered Jan 16, 2010 at 3:00

pib

3,33320 silver badges15 bronze badges

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

1 Comment

klew Over a year ago

Thanks, I already did it using appendChild, but I was putting a little more then just <script>. I appended my solution to question

2ndkauboy · Accepted Answer · 2010-03-23 20:27:02Z

0

If you want to include JavaScript into the head, you might do something like this:

$$('head').first().insert({
    bottom: new Element('script', {
        type: 'text/javascript'
    }).update('function helloWorldToConsole(){console.log("Hello World!")}')
});

This creates a new SCRIPT tag and inserts it to the bottom of your HEAD. But it would be much nicer if you add an external JavaScript file like this:

$$('head').first().insert({
    bottom: new Element('script', {
        type: 'text/javascript',
        src: 'http://www.example.com/path/file.js'
    })
});

You can than use the functions later in your scripts.

edited Mar 23, 2010 at 20:27

answered Mar 22, 2010 at 20:41

2ndkauboy

9,4033 gold badges34 silver badges67 bronze badges

Comments

hardevine · Accepted Answer · 2012-05-09 11:50:35Z

-1

try this..

    $('<script></script>',{
     type:'custom',
     id:'script1'
    }).appendTo('head').attr('type','text/javascript');

    $('#script1').append(< add js code here >);

});

answered May 9, 2012 at 11:50

hardevine

391 silver badge5 bronze badges

Collectives™ on Stack Overflow

How to insert <script> with Prototype?

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related