jQuery: parsing di un file di testo

  • jQuery
  • Gabriele Romanato

In questo articolo vedremo come effettuare il parsing di un file di testo formattato con degli short codes tramite jQuery. Utilizzeremo il metodo $.ajax() per reperire il file ed una funzione helper per effettuare il parsing vero e proprio. Vediamo insieme i dettagli.

Il nostro file di testo ha la seguente struttura:

[header level="1"]Titolo[/header]
[para]Testo[/para]

La funzione helper dividerà inizialmente il file in righe tramite l'individuazione del carattere \n, e quindi userà le espressioni regolari per estrarre i contenuti degli short codes e trasformarli rispettivamente in un intestazione ed un paragrafo HTML:


function parseText(text) {

	var parts = text.split(/\n/);
	var header = /^\[header\s.+\].+\[\/header\]$/;
	var para = /^\[para\].+\[\/para\]$/;
	var matches = [], i, len = parts.length;
	
	for(i = 0; i < len; i += 1) {
	
		var part = parts[i];
		
		if(header.test(part)) {
		
			var heading = '', level = /level="\d"/, headerText = /\].+\[/;
			
			var levelNumberMatch = part.match(level);
			var levelNumber = levelNumberMatch[0].replace(/level="+/g, '').replace('"', '');
			
			heading += '<h' + levelNumber + '>';
			
			var levelTextMatch = part.match(headerText);
			var levelText = levelTextMatch[0].replace('[', '').replace(']', '');
			
			heading += levelText + '</h' + levelNumber + '>';
			
			matches.push(heading);
			
		
		}
		
		if(para.test(part)) {
		
		
			var paragraph = '';
			var paraMatch = part.match(para);
			var paragraphText = paraMatch[0].replace(/\[\/?para]/g, '');
			
			paragraph = '<p>' + paragraphText + '</p>';
		
			matches.push(paragraph);
		
		}
		
	
	
	
	}
	
	
	return matches;



}

A questo punto possiamo usare il metodo $.ajax() impostando l'opzione dataType su text e inserendo il contenuto restituito dalla nostra funzione helper all'interno di un elemento della pagina. Tale contenuto viene ottenuto trasformando l'array restituito dalla funzione in una stringa:


$(function() {

	$.ajax({
		type: 'GET',
		dataType: 'text',
		url: 'test.txt',
		success: function(text) {
		
			var textParts = parseText(text);
			
			$('#test').html(textParts.join(''));
		
		}
    });

});

Potete visionare l'esempio finale in questa pagina.

Torna su