Pinceladas da Web

Caso você precise adicionar funcionalidades em suas aplicações, é necessário verificar antes se o usuário possui o complemento instalado em seu micro, pois caso contrário você pode alertá-lo disso e não ter problemas com suas aplicações. Isso pode ocorrer quando você está fazendo o uso do window.ActiveXObject(). Abaixo você vê uma recompilação dos detectores de plugins para Internet Explorer:

var plugins = {
	hasAcrobat:function() {
		if (!window.ActiveXObject) return false;
		try { if (new ActiveXObject('AcroPDF.PDF')) return true;}
		catch (e) {}
		try { if (new ActiveXObject('PDF.PdfCtrl')) return true;}
		catch (e) {}
		return false;
	},
	hasFlash: function() {
		if (!window.ActiveXObject) return false;
		try {if (new ActiveXObject('ShockwaveFlash.ShockwaveFlash')) return true;}
	    	catch (e) { return false;}
	},
	hasJava: function() {
		return (!navigator.javaEnabled());
	},
	hasQuickTime: function() {
		if (!window.ActiveXObject) return false;
		try { if (new ActiveXObject('QuickTime.QuickTime')) return true;}
		catch (e) {}
		try {if(new ActiveXObject('QuickTimeCheckObject.QuickTimeCheck')) return true;}
		catch (e) {};
		return false;
	},
	hasRealPlayer: function() {
		if (!window.ActiveXObject) return false;
	    	var definedControls = [
			'rmocx.RealPlayer G2 Control',
			'rmocx.RealPlayer G2 Control.1',
			'RealPlayer.RealPlayer(tm) ActiveX Control (32-bit)',
			'RealVideo.RealVideo(tm) ActiveX Control (32-bit)',
			'RealPlayer'
		];
		for (var i = 0; i < definedControls.length; i++) {
			try {if(new ActiveXObject(definedControls[i])) return true;}
			catch (e) {continue;}
		}
		return false;
	},
	hasShockwave: function() {
		if (!window.ActiveXObject) return false;
	    	try {if(new ActiveXObject(’SWCtl.SWCtl’)) return true;}
		catch (e) {return false;}
	},
	hasWMP: function() {
		if (!window.ActiveXObject) return false;
	  	try {if(new ActiveXObject(’WMPlayer.OCX’)) return true;}
		catch (e) { return false;}
	}
}

Exemplo

if (plugins.hasFlash()) {
   .... você possui o plugin do flash ...
} else {
   .... você não possui o plugin do flash ...
}

Demo

Você pode ver uma demonstração de uso aqui.

Referências

• Anieto2K – Detectar plugins instalados en Internet Explorer

Já vi pessoas utilizarem document.write para gerar uma página inteira, e sinceramente, isso é ridículo, sendo que existem opções mais limpas e cômodas. Utilizar JavaScript para fazer uma página inteira é uma coisa ridícula, mas caso seja necessário, aconselho a utilizar a DOM Tool.

DOM Tool se encarrefa de converter qualquer porção de HTML nas correspondentes chamadas JavaScript. Dessa forma, a criação de pequenas porções de HTML a partir de JavaScript serão mais rápidas de implementar.

Via: Anieto2K – DOM Tool, genera HTML mediante JS de forma fácil.

innerHTML com certeza foi uma mão na roda para os desenvolvedores durante muito tempo, e ainda hoje existe muita gente que o utiliza seja por não conhecer outras alternativas ou por pura preguiça.

Quais os problemas de utilizar innerHTML?

• innerHTML não é um padrão standard, é uma propriedade da Microsoft, e por isso já não é de se confiar muito.
• As aplicações baseadas no MIME Type application/xhtml+xml não suportam essa propriedade.
• A propriedade funciona como uma String, deixando de fora qualquer interação com o DOM que tentarmos introduzir.
• Ao tratar-se de uma cadeia de texto, tereos alguns problemas com acentuação, fechamento de tags, comentários na página.

Criando múltiplos elementos

A partir de um Array, vamos criar uma lista de elementos uitlizando innerHTML e depois usando DOM.

innerHTML:

data = new Array("one","two","three");
mHTML = "<ul>";
for(i=0;i<data.length;i++) {
	mHTML+="<li>" + data[i] + "</li>";
}
mHTML+="</ul>";
document.getElementById("mContainer").innerHTML = mHTML;

Dessa forma definimos todo o HTML necessário para construírmos nossa lista, usando DOM seria dessa forma:

DOM:

data = new Array("one","two","three");
 // create the UL element that our LI elements will descend from
eUL = document.createElement(”ul”);
// loop over the length of the “data” array
for(i=0;i<data.length;i++) {
	// create an LI
	eLI = document.createElement(”li”);
	// append the value of data[i] to the LI as a text node
	eLI.appendChild(document.createTextNode(data[i]));
	// append the LI to the UL
	eUL.appendChild(eLI);
}
// append the UL to the “mContainer” element.
document.getElementById(”mContainer”).appendChild(eUL);

Referências

• Anieto2K – DOM como alternativa a innerHTML