Dynamisch JS met document.write functie invoegen - Softwareontwikkeling

vrijdag 18 september 2009 17:41

Acties:

0 Henk 'm!

Topicstarter

Beste Tweakers,

Op een pagina die ik aan het ontwikkelen ben kunnen er blokken met HTML/JS code (soort van widgets/plugins) dynamisch ingevoegd worden aan een pagina. De code die ingevoegd kan worden kan ook zelf door de gebruiker bepaald worden, en kan eventueel ook (externe) javascript bevatten.

Nu werkt dit allemaal erg goed TOTDAT men een blok HTML/JS invoegd dat gebruik maakt van een document.write of document.writeln functie. Zodra een van deze functies namelijk ingevoegd wordt zal er een nieuwe pagina aangemaakt worden(dmv document.open). Wat ik zou willen bereiken is dat deze document.write aanroepen de inhoud wegschrijven op de plaats waar de script tag ingevoegd is!

De vraag is dus of het mogelijk is om deze code dynamisch in te voegen en uit te laten voeren zonder dat de inhoud van de huidige pagina verloreren gaat! Ik heb zitten zoeken maar kom op echt niets bruikbaars uit.

Voorbeeld
Een voorbeeldje waar een dergelijke fout zich voordoet staat hieronder.

Ik zou hier graag als resultaat terugkrijgen `Het systeem werkt _niet_ niet.`. Wat er echter gebeurd is dat er een nieuwe pagina opent waarin alleen de tekst `niet` komt te staan.

De pagina die de dynamische html/javascript inlaad:

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />

    <script src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
    <script type="text/javascript">
        $( function(){
            $('#insert').load('insert.js');
        } );
    </script>
</head>
<body>

    Het systeem werkt 
    <span id="insert">

    </span>
    niet.

</body>
</html>

En het bijbehorende stukje JS dat ingevoegd is, insert.js:

HTML:

1
2
3

_
<script type="text/javascript">document.write('niet');</script>
_

Alvast hartelijk bedankt!

[ Voor 35% gewijzigd door maurad3r op 18-09-2009 18:38 ]

vrijdag 18 september 2009 18:06

Acties:

0 Henk 'm!

RobIII

Admin Devschuur®

^ Romeinse Ⅲ ja!

Wat jij wil is een eval() achtig iets; maar ik adviseer je eerder om eens te kijken waarom je dynamisch JS in wil voegen en of je dat niet op andere/nettere manieren kunt oplossen.

[edit]nu ik je topicstart nog eens lees vraag ik me af of ik je wel helemaal goed begrijp. Heb je niet een concreet voorbeeld en wat relevante(!!) code erbij? Dat praat wat makkelijker

[ Voor 34% gewijzigd door RobIII op 18-09-2009 18:08 ]

There are only two hard problems in distributed systems: 2. Exactly-once delivery 1. Guaranteed order of messages 2. Exactly-once delivery.

Je eigen tweaker.me redirect

Over mij

vrijdag 18 september 2009 18:45

Acties:

0 Henk 'm!

maurad3r

Topicstarter

Het idee van het laten invoegen van deze JS is simpelweg dat we de gebruikers de vrijheid willen geven om te doen wat ze willen met hun pagina. Dat zou uiteen kunnen lopen van een script dat sneeuw over je pagina laat lopen tot een bewegende klok. We willen vervolgens dat dit toevoegen live gebeurd, zonder dat de pagina moet vernieuwen. En met deze twee puntjes kom je volgens mij niet onder deze aanpak uit (ik hoor graag als dit wel zo is!).

Een eval achtige-manier lijkt inderdaad een richting te zijn. Ik zat zelf te denken aan javascript equivalenten van de ob_start en ob_get_contents functies in php. Ik zal naar beide eens wat zoekwerk doen.

Ik heb een voorbeeldje toegevoegd, ik hoop dat het daarmee wat duidelijker is!

zaterdag 19 september 2009 03:10

Acties:

0 Henk 'm!

_Thanatos_

Ja, en kaal

Zijnootje: als je de gebruiker zóveel vrijheid in scripting geeft dat zelfs document.write wordt toegelaten, dan kan de gebruiker dus ook engere dingen doen. Maar ook evt reclamebanners wegflikkeren.

Of het script van andere widgets stukmaken (want op deze manier dwing je geen closure af, dus alles is een global). Zie maar:

JavaScript:

/* widget 1 */
var a = 1;
function animeer() {
  a++;
  doe_iets_met_a();
}

/* verderop widget 2 */
var a = 1000;
function animeer() {
  a--;
  doe_iets_met_a();
}

Moet je zien wat een bagger dat kan opleveren. Je hebt twee functies die hetzelfde heten. En al zouden ze verschillend heten, ze zitten aan "elkaars" variabele. Met een closure los je dat op:

JavaScript:

/* widget 1 */
(function() {
  var a = 1;
  function animeer() {
    a++;
    doe_iets_met_a();
  }
})();

/* verderop widget 2 */
(function() {
  var a = 1000;
  function animeer() {
    a--;
    doe_iets_met_a();
  }
})();

Maarja, je wilt dat ALLES toegestaan is. Dus krijg je vreemde problemen wanneer er genoeg widgets komen. Gegarandeerd. Kratje bier durf ik er wel om te verwedden

日本！🎌

zaterdag 19 september 2009 09:19

Acties:

0 Henk 'm!

crisp

Devver

Pixelated

Gebruik gewoon iframes voor die widgets/plugins, dat scheelt al een hoop problemen

Intentionally left blank