Scrivere HTML con XML

  • sostituire “&” con “&”
  • chiudere tutti gli attributi in apici singoli o doppi
  • chiudere tutti i tag html con />

In php il primo punto si risolve con str_replace(‘&’, ‘&’, $stringa);
Anche il secondo punto si può risolvere con str_replace se si conosce quale attributo è senza apici.
In caso contrario, si deve usare una regex.
Anche il terzo punto richiede una regex.

Importare XHTML con importNode

http://stackoverflow.com/questions/804180/can-i-append-an-ajax-requestxml-object-to-my-document-tree-all-in-one-go

1) Add namespace declaration:

<table xmlns="http://www.w3.org/1999/xhtml">

2) Instead of directly inserting a reffered XML DOM Element, you should first import that node into your HTML DOM Document:

var element = document.importNode(responseXML.firstChild.firstChild, true);
document.getElementById('entryPoint').appendChild(element);

Hope this helps!

In Javascript, aggiungere la dichiarazione dello spazio nomi xmlns e poi importare con document.importNode.

Dal lato server, in PHP, creare un prologo XML tipo <?xml version=”1.0″?>

dopodichè ci sono 2 alternative:

  1. Usare le funzioni DOM di PHP per creare XML , impostare il “Content-type: text/xml”, e quindi fare l’ output della stringa
  2. Impostare il “Content-type: text/xml”, e fare un output “formattato” del prologo e del contenuto (con print o echo).

Ancora Javascript e separazione del codice – addEventListener

Tratto da http://andrea.zilio.name/blog/2007/01/eventi-in-javascript-il-w3c/ :

Handler ed Event Object

In ogni funzione associata ad uno specifico evento, registrata attraverso uno qualsiasi dei metodi appena visti, è possibile ottenere un riferimento all’oggetto su cui l’handlerè in esecuzione mediante la parola chiave this
Inoltre ad ogni handler viene passato come primo parametro un oggetto che fornisce, tramite le sue proprietà, delle informazioni sull’evento in corso, fra cui:

type
Indica il tipo di evento (es: “click“,”mousemove“,”load“,”focus“,ecc…)

target
Contiene un riferimento al nodo che ha generato l’evento

currentTarget
Contiene un riferimento al nodo per cui si stanno eseguendo gli handler

eventPhase
Un valore intero che indica se la fase corrente è di Capture (1), At Target (2) o Bubble (3)

bubbles
Un valore booleano che indica se l’evento corrente supporta il bubbling.
(infatti per tutti gli eventi vengono eseguite le fasi At Target e di Capture, ma solo per alcunianche quella di Bubble.)

cancelable
Un altra proprietà booleana che indica se è possibile annullare l’azione di default associata all’evento
Lo stesso oggetto che fornisce l’accesso alle proprietà appena indicate, offre anche 2 utilissimi metodi:

stopPropagation()
Invocando questo metodo viene terminata la propagazione dell’evento ad altri nodi. Ferma quindi la fase di Bubble o di Capture, ma non annulla l’effetto dell’evento.

preventDefault()
Chiamando questo metodo è, invece, possibile annullare l’eventuale azione di default associata all’evento (es: l’invio di un form, la navigazione dopo il click su un link, ecc…)

Ajax and the true separation of presentation, content and behavior

Articolo trovato qui: articolo originale

Contrary to what some may argue, you can use Ajax technologies in web applications and keep your code clean and separated from your presentation markup and content.

To kick off this column on Web Application development, I am going to address this issue with the 3 simple rules I used while working on the Form Builder.

Note: cross-browser considerations intentionally left out.

Rule #1: Use unobtrusive javascript

Don’t embed javascript inside your tags.

<a href="..." onclick="dostuff();"> do stuff </a>

This is just as bad as inline CSS or font tags.

Instead, do:

<a href="..." id="stuffDoer"> do stuff </a>

and have a separate javascript file, linked from the <head> of your page, with something like this :

document.addEventListener ('load', function() {
        document.getElementById('stuffDoer').onclick = doStuff;}, false);

See also these other recommendations.

Rule #2: Do not use javascript to generate markup

Or let me put it this way: build template driven applications. Use XMLHTTPRequest or XSLT to retrieve XHTML formatted strings, and insert them in your document.

The insertion point is identified by a placeholder, often an empty DIV element:

<div id="my_placeholder"></div>

For XHTML generated server side, use XMLHttpRequest:

var xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET", someResourceURI, true);
xmlhttp.onreadystatechange= function() {
        if (xmlhttp.readyState==4) {
                document.getElementById('my_placeholder').innerHTML = xmlhttp.responseText;
        }
        xmlhttp.send()
}

For XHTML generated client-side, use XSLT:

var processor = new XSLTProcessor();
processor.importStylesheet(your_xsl_template);
var xhtml = processor.transformToDocument(your_xml_data);
document.getElementById('my_placeholder').importNode(xhtml);

Note: The Sarissa wrapper provides a uniform syntax across browsers for all Ajax related coding.

Rule #3: Do not use javascript to style your content

Don’t do

document.getElementById('some_id').style.color = '#ff0000';

Instead do:

document.getElementById('some_id').className = 'some_class';

and set the color property in your CSS stylesheet

.some_class {
color:  #ff0000;
}

If you are trying to achieve a visual effect, you may want to consider class switching:

document.getElementById('some_id').className.replace('old_class','new_class');