JS API en generate HTML

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Daniel van Seggelen

Daniel van Seggelen

24/05/2019 01:55:32
Quote Anchor link
Wat ik probeer te doen is een wijze waarop men een JS code in hun site kunnen plakken waarbij een stukje html gegenereerd word met daarin een element wat de laatste prijzen in dit geval laat zien van een bepaald product.

JS meer ondersteund worden en het moet cross browser zijn.
Wat is de beste manier wat werkt op de meeste browsers? Gewoon een ajax call?

Alvast bedankt
 
PHP hulp

PHP hulp

18/04/2024 10:23:45
 
Rob Doemaarwat

Rob Doemaarwat

24/05/2019 08:00:10
Quote Anchor link
Ehhhh ... Vertel eens iets meer wat je wilt:
- Een veldje in je pagina dat constant bijgewerkt wordt met de laagste prijs (die dus kan variëren in de tijd)?
- Moet de gebruiker "iets doen" (op een knop drukken) om daarna pas de laagste prijs op te halen?
- Hoe vaak wisselt "de laagste prijs"?
 
Daniel van Seggelen

Daniel van Seggelen

24/05/2019 10:55:12
Quote Anchor link
Dagelijks worden de prijzen bijgewerkt.
Dus ik wil dat elke keer eigenlijk dat een bezoekers de pagina bezoekt en een server request via ajax bijv word gedaan om de huidige prijzen te laden.
 
- Ariën  -
Beheerder

- Ariën -

24/05/2019 11:20:36
Quote Anchor link
Is dat niet een beetje overdreven? Of veranderen de prijzen met een dermate hoge frequentie dat je het realtime wilt aanpassen? Je kan net zo goed een JS-file genereren met een statische prijs, die je serverside aanpast.
 
Daniel van Seggelen

Daniel van Seggelen

24/05/2019 12:43:50
Quote Anchor link
Nee, de prijzen veranderen 1 keer per dag.
Er word nu al een statishe html gecreerd die serverside na een druk op de knop deze html genereerd en mensen kunnen die in blogs op andere websites plaatsen.

Een dag later zijn de prijzen anders, dus kloppen die niet meer.
Ik wil dus dat men bij elke refresh of bezoek via js een request doet om een nieuw lijst te tonen.
 
Rob Doemaarwat

Rob Doemaarwat

24/05/2019 13:33:08
Quote Anchor link
Kun je dan niet gewoon 1x/dag die HTML opnieuw genereren?
 
- Ariën  -
Beheerder

- Ariën -

24/05/2019 13:33:25
Quote Anchor link
Maar moeten die realtime worden veranderd? Zo niet, dan lijkt AJAX mij overkill...

Je kan prima de prijzen statisch naar de bezoeker leveren. Zodra ze tussentijds veranderd zijn, zijn ze na een refresh weer vernieuwd.

Desnoods kan je de dagdatum ook meegeven voor de duidelijkheid.
Gewijzigd op 24/05/2019 13:34:20 door - Ariën -
 
Daniel van Seggelen

Daniel van Seggelen

24/05/2019 14:31:49
Quote Anchor link
Ok, is ajax de beste manier, was eigenlijk mijn vraag?

Dus zoiets als:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
$.ajax({
    url: "https://testserver.nl?datum=19-05-25",

    dataType: "jsonp",
    success: function( response ) {
        console.log( response ); // server response
// html genereren
$("#element").append( response);

Maar ik wil het opdezelfde locatie
var spanNode = document.createElement('span');
var textNode = document.createTextNode('there.');
    spanNode.appendChild( textNode );

var ele = document.currentScript;   //get current script element
    ele.parentNode.insertBefore(spanNode,ele);  //append the span before the script

    }

});


Ik neem aan dat er jsonp gebruikt moet worden voor cross browser compatibility ?
 
- Ariën  -
Beheerder

- Ariën -

24/05/2019 14:47:59
Quote Anchor link
Ja, maar is AJAX lijkt mij best overkill. Je kan dan net zo goed een statische externe JS inladen via je script-element.

Tip: Zorg ervoor dat die enkel via SSL bereikbaar is.
Gewijzigd op 24/05/2019 14:52:10 door - Ariën -
 
Daniel van Seggelen

Daniel van Seggelen

24/05/2019 15:01:22
Quote Anchor link
Ok, als ik dit dit inlaad:

<script type="text/javascript" src="js.js">

en dan in js.js

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
var spanNode = document.createElement('span');
var textNode = document.createTextNode('html gegenereerde code');
    spanNode.appendChild( textNode );


Is dit crossbrowser friendly genoeg?
 
- Ariën  -
Beheerder

- Ariën -

24/05/2019 15:11:56
Quote Anchor link
Ik denk dat anderen geen js.js op hun server hebben staan. Dus gebruik een absolute URL. ;-)
 
Daniel van Seggelen

Daniel van Seggelen

24/05/2019 15:25:05
Quote Anchor link
ze moeten het toch vam mijn server laden https://test.nl/js.js ??
 
- Ariën  -
Beheerder

- Ariën -

24/05/2019 15:42:02
Quote Anchor link
Dit is toch de code die je gebruikers op hun site kunnen invoeren?
Dan moet je dus die URL ook meegeven.
 
Daniel van Seggelen

Daniel van Seggelen

24/05/2019 16:53:08
Quote Anchor link
Quote:
Dus gebruik een absolute URL


Juist maar waarom dan een absolute url ?
 
Thomas van den Heuvel

Thomas van den Heuvel

24/05/2019 17:36:04
Quote Anchor link
En om te zorgen dat het JavaScript-bestand niet wordt gecached zou je er een random string achteraan kunnen/moeten gooien.
 
- Ariën  -
Beheerder

- Ariën -

24/05/2019 18:06:24
Quote Anchor link
Daniel van Seggelen op 24/05/2019 16:53:08:
Quote:
Dus gebruik een absolute URL


Juist maar waarom dan een absolute url ?


Zie ook:

- Ariën - op 24/05/2019 15:11:56:
Ik denk dat anderen geen js.js op hun server hebben staan. Dus gebruik een absolute URL. ;-)


- Ariën - op 24/05/2019 15:42:02:
Dit is toch de code die je gebruikers op hun site kunnen invoeren?
Dan moet je dus die URL ook meegeven.
Gewijzigd op 24/05/2019 18:07:04 door - Ariën -
 
Daniel van Seggelen

Daniel van Seggelen

25/05/2019 04:09:15
Quote Anchor link
Helaas werkt dit niet. Geen console errors niks.


in http://test.nl/js.js
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
var spanNode = document.createElement('div');
var textNode = document.createTextNode('test');
    spanNode.appendChild( textNode );



in test.html

<div>

<script type="text/javascript" src="https://www.test.nl/js.js"></script>

</div>

Er word geen enkele elemen aangemaakt
 
Adoptive Solution

Adoptive Solution

25/05/2019 08:28:59
Quote Anchor link
Gevonden via de interwebs :

https://www.w3schools.com/js/js_htmldom_nodes.asp

Dit gemaakt :

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
<div id='testdiv'></div>
<script src="https://www.test.nl/js.js"></script>


In js.js bestand :

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
var textNode = document.createTextNode('test');
var element  = document.getElementById('testdiv');
element.appendChild(textNode);
 
- Ariën  -
Beheerder

- Ariën -

25/05/2019 08:57:58
Quote Anchor link
Inderdaad netjes dat als de gebruiker zelf kan laten bepalen waar hij zijn prijs wilt neerzetten, aan de hand van een placeholder-divje.
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.