document write / onclick

donderdag 8 april 2010 09:04

Acties:

0 Henk 'm!

Verwijderd

Topicstarter

Hallo,
Ik ben duidelijk nog geen javascript veteraan.
Waarom werkt onderstaande niet? Ik krijg de error undefined variable 'card' van Opera, dus ik denk dat op de een of andere manier die functie nog niet bestaat op dat moment?
Thx.

code:

<body onload="init();">
<script>
function card()
{
alert('card');
}
function init()
{
document.write('<input type=button onclick="card();" value=Go><table border=1><tr><td>bla');
}
</script>

donderdag 8 april 2010 09:19

Acties:

0 Henk 'm!

Spinal

Wat als je het script in de <head> plaatst ipv ná de <body> ?

Full-stack webdeveloper in Groningen

donderdag 8 april 2010 09:27

Acties:

0 Henk 'm!

Aganim

I have a cunning plan..

Als je met Firefox + Developer Tools kijkt naar de gegenereerde broncode (View Source->View Generated Source), zal je het volgende zien:

HTML:

1	<html><head></head><body><input onclick="card();" value="Go" type="button"><table border="1"><tbody><tr><td>bla</td></tr></tbody></table></body></html>

Gebruik dus niet document.write, maar maak gebruik van innerHTML op het stuk website wat je wilt aanpassen. (Dit werkt met id's, dus je kan ook alleen een paragraaf, div, etc aanpassen ipv direct de hele body.)

En begin eerst eens met het plaatsen van je scripts in de head, ipv de body. Je vervangt nu het gehele document, inclusief scripts. Ook als je innerHTML los laat op je body, vervang je de scripts in de body, echter is dat probleem dus opgelost als de scripts zich gewoon netjes in de head bevinden.

[ Voor 9% gewijzigd door Aganim op 08-04-2010 09:29 ]

donderdag 8 april 2010 09:50

Acties:

0 Henk 'm!

Verwijderd

Topicstarter

Gebruik dus niet document.write, maar maak gebruik van innerHTML op het stuk website wat je wilt aanpassen.

Ja dan werkt het wel inderdaad.

En begin eerst eens met het plaatsen van je scripts in de head, ipv de body. Je vervangt nu het gehele document, inclusief scripts. Ook als je innerHTML los laat op je body, vervang je de scripts in de body, echter is dat probleem dus opgelost als de scripts zich gewoon netjes in de head bevinden.

Duidelijk.
Bedankt he.

donderdag 8 april 2010 10:51

Acties:

0 Henk 'm!

Aganim

I have a cunning plan..

Graag gedaan.

Kleine toevoeging op mijn eigen antwoord: innerHTML werkt zelf natuurlijk niet met ID's, je moet dan wel document.getElementById("id").innerHTML = "bla bla" gebruiken.

Daarnaast nog wat ongevraagd advies:

- Je hebt op je site nu de scripts boven de <html> tag staan. Het moet tussen de <head> en </head> staan.
- Je gebruikt geen doctype, dus een browser weet nu niet hoe hij je site moet interpreteren. Gezien je ervaring kan je het beste kiezen voor HTML 4.01 Transitional of XHTML 1.0 Transitional.

Bij XHTML moet je er op letten dat je tags altijd zonder hoofdletters schrijft (dit hoort in HTML 4.01 eigenlijk ook, maar wordt je daar nog in vergeven) en je dient alle tags te sluiten, dus ook tags als <img> of <br>, die worden <img src="voorbeeld" /> en <br />.

- Gebruik CSS voor opmaak, opmaak hoort niet in HTML. <font (face)> is deprecated en werkt dus niet altijd meer.

- Dit is dubbelop:

<body background="images/yellow.jpg">
<body onload="site('Home');">

Ten eerste kan dat in 1 tag: <body background="images/yellow.jpg" onload="site('Home')">, ten tweede is het wederom netter om je background via CSS te laden.

Ook kan je die tabel met buttons dan dumpen, je kan buttons prima naast elkaar zetten met CSS. Is overzichtelijker, makkelijker aan te passen en semantisch beter.

[ Voor 75% gewijzigd door Aganim op 08-04-2010 11:04 ]

donderdag 8 april 2010 12:09

Acties:

0 Henk 'm!

Verwijderd

Topicstarter

Ha, je hebt gespioneerd!

Kleine toevoeging op mijn eigen antwoord: innerHTML werkt zelf natuurlijk niet met ID's, je moet dan wel document.getElementById("id").innerHTML = "bla bla" gebruiken.

Dat had ik gedaan hoor. Ik schreef immers dat het werkte.

- Je hebt op je site nu de scripts boven de <html> tag staan. Het moet tussen de <head> en </head> staan.

Fixed. Ik ga voortaan scripts tussen de <head> zetten.

- Je gebruikt geen doctype, dus een browser weet nu niet hoe hij je site moet interpreteren. Gezien je ervaring kan je het beste kiezen voor HTML 4.01 Transitional of XHTML 1.0 Transitional.

Nochtans renderen ze het wel he. Ik zal eens gaan lezen over doctype..

Bij XHTML moet je er op letten dat je tags altijd zonder hoofdletters schrijft (dit hoort in HTML 4.01 eigenlijk ook, maar wordt je daar nog in vergeven) en je dient alle tags te sluiten, dus ook tags als <img> of <br>, die worden <img src="voorbeeld" /> en <br />.

Dit vind ik weer wat minder. Ik vind het juist wel handig dat je niet alle tags hoeft af te sluiten.

- Gebruik CSS voor opmaak, opmaak hoort niet in HTML. <font (face)> is deprecated en werkt dus niet altijd meer.

Ik beken schuld, of eigenlijk luiheid.

- Dit is dubbelop:
<body background="images/yellow.jpg">
<body onload="site('Home');">

Fixed

Ook kan je die tabel met buttons dan dumpen, je kan buttons prima naast elkaar zetten met CSS. Is overzichtelijker, makkelijker aan te passen en semantisch beter.

Die tabel met buttons is php code.
Niks mis mee toch?
Die 1e vraag van me hierboven had ik met php wel werkend, alleen omdat ik toch steeds meer met javascript (ajax) ga doen, wilde ik dat specifieke scriptje clientside only maken, gewoon om te kijken of het werkt, maar verder mix ik toch met php hoor, ben er nog steeds toch meer in thuis dan javascript.

[ Voor 14% gewijzigd door Verwijderd op 08-04-2010 13:46 ]

donderdag 8 april 2010 14:22

Acties:

0 Henk 'm!

Aganim

I have a cunning plan..

Die tabel met buttons is php code.
Niks mis mee toch?

Maar als je ervoor zorgt dat de buttons gewoon in een (gecentreerde) div staan, de buttons een x marge hebben zodat ze genoeg onderlinge afstand bewaren heb je helemaal geen tabel nodig.

Dat had ik gedaan hoor. Ik schreef immers dat het werkte.

Snap ik, 't was meer voor het geval dat iemand met dezelfde vraag dit terugleest.

Nochtans renderen ze het wel he. Ik zal eens gaan lezen over doctype..

Ze renderen, maar het risico bestaat dat iedere browser dit totaal anders doet. Immers weten ze nu niet aan welke standaard ze zich moeten houden, zelfs met Doctype kom je verschillen tegen natuurlijk. Maar als je dit zoveel mogelijk kan voorkomen door netjes een doctype op te geven, is dat wel zo handig.

Dit vind ik weer wat minder. Ik vind het juist wel handig dat je niet alle tags hoeft af te sluiten.

Ach ja, dat is een kwestie van eigen voorkeur, ik vind dat XHTML net even wat consistenter is. Maar verder is het niet goed of fout, zolang je de juiste doctype gebruikt. (Een browser die standaard XHTML zou pakken bij ontbreken van de doctype, zal niet vrolijk worden van je code, om even een extreem geval als voorbeeld te geven.)

donderdag 8 april 2010 14:47

Acties:

0 Henk 'm!

BtM909

Watch out Guys...

Javascript

Aganim schreef op donderdag 08 april 2010 @ 14:22:
[...]
Ach ja, dat is een kwestie van eigen voorkeur, ik vind dat XHTML net even wat consistenter is. Maar verder is het niet goed of fout, zolang je de juiste doctype gebruikt. (Een browser die standaard XHTML zou pakken bij ontbreken van de doctype, zal niet vrolijk worden van je code, om even een extreem geval als voorbeeld te geven.)

Ware het dat als je het als true XHTML gaat aanbieden, een deel van je bezoekers er vervolgens niks meer mee kan

Gewoon voor HTML4.01 strict of HTML5 gaan (zijn inmiddels behoorlijk consistent aan 't worden

)

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.

donderdag 8 april 2010 16:46

Acties:

0 Henk 'm!

Aganim

I have a cunning plan..

Ware het dat als je het als true XHTML gaat aanbieden, een deel van je bezoekers er vervolgens niks meer mee kan

Zoals? Niet dat ik je niet geloof, ik heb de wijsheid nog steeds niet in pacht, maar ik ben nog geen browsers tegengekomen die niet om kunnen gaan met XHTML.

donderdag 8 april 2010 16:52

Acties:

0 Henk 'm!

crisp

Devver

Pixelated

Javascript

Aganim schreef op donderdag 08 april 2010 @ 16:46:
[...]

Zoals? Niet dat ik je niet geloof, ik heb de wijsheid nog steeds niet in pacht, maar ik ben nog geen browsers tegengekomen die niet om kunnen gaan met XHTML.

Internet Explorer...

Intentionally left blank

donderdag 8 april 2010 18:33

Acties:

0 Henk 'm!

Verwijderd

Topicstarter

Maar als je ervoor zorgt dat de buttons gewoon in een (gecentreerde) div staan, de buttons een x marge hebben zodat ze genoeg onderlinge afstand bewaren heb je helemaal geen tabel nodig.

Ik doe dit

code:

$menu = array('Home', 'Planetdance', 'Oracle', 'Tarot', 'Forum', 'Links', 'About');
$i = 0;
foreach ($menu as $val)
    echo "<td width=150 align=center><input type=button value=$val onclick=\"site('$val');\">";

En in site() haal ik met ajax de content weer op.
Het zou ook in javascript kunnen maar zo werkt het in ieder geval ook.

donderdag 8 april 2010 18:37

Acties:

0 Henk 'm!

Davio

Aganim schreef op donderdag 08 april 2010 @ 16:46:
[...]

Zoals? Niet dat ik je niet geloof, ik heb de wijsheid nog steeds niet in pacht, maar ik ben nog geen browsers tegengekomen die niet om kunnen gaan met XHTML.

Ligt aan de manier waarop je het serveert. XHTML moet eigenlijk met mimetype application/xhtml+xml aan de browser worden aangeboden. Bij Firefox werkt dit, maar Internet Explorer denkt dan dat je iets wilt downloaden in plaats van renderen, dus dan moet je voor IE je mimetype aanpassen naar text/html.

Oh, nog een tip voor topicstarter: XHTML accepteert geen short attributes zoals:

HTML:

1	<input type="text" disabled />

Je moet dit schrijven (hoe belachelijk ook):

HTML:

1	<input type="text" disabled="disabled" />

disabled="true" of disabled="1" werkt allemaal niet, je moet twee keer dezelfde naam gebruiken voor 'boolean' attributes.

Daarbij moeten alle attribuutwaarden tussen quotes, dus bijvoorbeeld <table border="1"> ipv <table border=1>, al is het natuurlijk beter zulke dingen in je CSS te regelen.

[ Voor 32% gewijzigd door Davio op 08-04-2010 18:41 ]

donderdag 8 april 2010 21:28

Acties:

0 Henk 'm!

Aganim

I have a cunning plan..

Ok, true. Nooit wat van gemerkt, omdat ik slordig genoeg text/html voorschotel.

De mimetype klopt niet, dus helemaal correct is het niet, dat geef ik toe. Overigens, het gedrag bij attributen als 'disabled' en 'checked' is inderdaad een beetje vreemd, maar niet onoverkomelijk als je het mij vraagt. Dat ene woordje extra tikken overleef ik wel.

Gelukkig mogen we bij HTML5 gewoon zelf kiezen welke stijl we aanhouden.

vrijdag 9 april 2010 11:52

Acties:

0 Henk 'm!

moozzuzz

Aganim schreef op donderdag 08 april 2010 @ 21:28:
Ok, true. Nooit wat van gemerkt, omdat ik slordig genoeg text/html voorschotel.

De mimetype klopt niet, dus helemaal correct is het niet, dat geef ik toe. Overigens, het gedrag bij attributen als 'disabled' en 'checked' is inderdaad een beetje vreemd, maar niet onoverkomelijk als je het mij vraagt. Dat ene woordje extra tikken overleef ik wel.

Gelukkig mogen we bij HTML5 gewoon zelf kiezen welke stijl we aanhouden.

De vraag is dan natuurlijk wat er nog overblijft van Xhtml en wat de voordelen zijn. Vaak roept men dan iets als tagsoup of netjes coden. Doch het is niet verboden in HTML 4.01 om "proper" te coden en je tags af te sluiten. Je kan perfect de goede zaken van XHTML-codestyle gebruiken in een HTML 4.01 document. Ben je meteen helemaal "correct" bezig zonder enig excuus

.

vrijdag 9 april 2010 12:55

Acties:

0 Henk 'm!

Aganim

I have a cunning plan..

Opzich wordt je door XHTML style te coden gedwongen om consistent te werken. (Altijd haakjes bij attributen, altijd lower caps, alles sluiten, etc.)

Door doctype XHTML te leveren met text/html lever je niet echt XHTML, dat is waar. Maar Firefox + Dev tools en de W3C validator valideren nog wel tegen de XHTML standaard. Je hebt dus wel garantie dat je code wat dat betreft op orde is. Ga je valideren tegen HTML 4.01, zal hij nog steeds eventuele slordigheden negeren. Uiteraard kan je wel handmatig valideren tegen een andere doctype, maar op een gegeven moment vind ik dat meer moeite dan dat het waard is.

Verder ben ik het met je eens dat het niet netjes en 100% correct is, daar niet van.

Onderwerpen