Por ejemplo:

foo = 'hello world!';
foo = ucfirst(foo);             // Hello world!

bar = 'HELLO WORLD!';
bar = ucfirst(bar.toLowerCase()); // Hello world!

Si la cadena esta entera en mayúsculas y se quiere tener sólo la primera, priemero se debería pasar toda a minúscula y después cambiar la primera.

Articulos relacionados

• La función str_replace() de PHP en Javascript (1)
• Detectar petición AJAX con PHP (1)
• PHP: Ordenar array por el valor de un campo (0)
• Comprobar si un directorio está vacío con PHP (0)
• Comprobar validez de un dominio con PHP (2) (0)
• Tildes en Javascript (0)
• Base64 (encode y decode) en Javascript (3)
• Enviar el log de errores de PHP por email (0)
• Obtener la URL que se esta visitando con PHP (0)
• Comprobar DNI / NIF con PHP (3)

Por ejemplo, á en unicode sería \u00e1, de manera que es prácticamente imposible recordar todos los carácteres, por eso lo más lógico es hacer una función que nos los convierta, así podemos escribir con los carácteres que queramos sin preocuparnos de la codificación, y luego aplicar la función.

He hecho una con las más importantes, usa replace():

function tildes_unicode(str){
	str = str.replace('á','\u00e1');
	str = str.replace('é','\u00e9');
	str = str.replace('í','\u00ed');
	str = str.replace('ó','\u00f3');
	str = str.replace('ú','\u00fa');

	str = str.replace('Á','\u00c1');
	str = str.replace('É','\u00c9');
	str = str.replace('Í','\u00cd');
	str = str.replace('Ó','\u00d3');
	str = str.replace('Ú','\u00da');

	str = str.replace('ñ','\u00f1');
	str = str.replace('Ñ','\u00d1');
	return str;
}

Un ejemplo de uso sería:

var cadena = "Así";
alert(tildes_unicode(cadena)); // Así
alert(cadena); // Así

Articulos relacionados

• Base64 (encode y decode) en Javascript (3)
• ucfirst de PHP en Javascript (0)
• Enviar el log de errores de PHP por email (0)
• Obtener la URL que se esta visitando con PHP (0)
• Comprobar DNI / NIF con PHP (3)
• La función str_replace() de PHP en Javascript (1)
• Comprobar la validez de un dominio con PHP (1)
• str_replace() de PHP en Javascript (0)
• Aprender jQuery, 1: Qué és y por qué usarlo. (0)
• Recursividad en mkdir de PHP (0)

En PHP es algo así:

<?PHP
$cadena = base64_encode('w00t');
echo $cadena; # dzAwdA==
$cadena = base64_decode('dzAwdA==');
echo $cadena; # w00t
?>

Y en Javascript, con el código que pondré a continuación, sería algo así:

<script>
var cadena = Base64.encode('w00t');
alert(cadena); // dzAwdA==
var cadena = Base64.decode('dzAwdA==');
alert(cadena); // w00t
</script>

El código javascript para que esto funcione, es el siguiente:

/**
*
*  Base64 encode / decode
*  http://www.webtoolkit.info/
*
**/

var Base64 = {

	// private property
	_keyStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",

	// public method for encoding
	encode : function (input) {
		var output = "";
		var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
		var i = 0;

		input = Base64._utf8_encode(input);

		while (i < input.length) {

			chr1 = input.charCodeAt(i++);
			chr2 = input.charCodeAt(i++);
			chr3 = input.charCodeAt(i++);

			enc1 = chr1 >> 2;
			enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
			enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
			enc4 = chr3 & 63;

			if (isNaN(chr2)) {
				enc3 = enc4 = 64;
			} else if (isNaN(chr3)) {
				enc4 = 64;
			}

			output = output +
			this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +
			this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);

		}

		return output;
	},

	// public method for decoding
	decode : function (input) {
		var output = "";
		var chr1, chr2, chr3;
		var enc1, enc2, enc3, enc4;
		var i = 0;

		input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");

		while (i < input.length) {

			enc1 = this._keyStr.indexOf(input.charAt(i++));
			enc2 = this._keyStr.indexOf(input.charAt(i++));
			enc3 = this._keyStr.indexOf(input.charAt(i++));
			enc4 = this._keyStr.indexOf(input.charAt(i++));

			chr1 = (enc1 << 2) | (enc2 >> 4);
			chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
			chr3 = ((enc3 & 3) << 6) | enc4;

			output = output + String.fromCharCode(chr1);

			if (enc3 != 64) {
				output = output + String.fromCharCode(chr2);
			}
			if (enc4 != 64) {
				output = output + String.fromCharCode(chr3);
			}

		}

		output = Base64._utf8_decode(output);

		return output;

	},

	// private method for UTF-8 encoding
	_utf8_encode : function (string) {
		string = string.replace(/\r\n/g,"\n");
		var utftext = "";

		for (var n = 0; n < string.length; n++) {

			var c = string.charCodeAt(n);

			if (c < 128) {
				utftext += String.fromCharCode(c);
			}
			else if((c > 127) && (c < 2048)) {
				utftext += String.fromCharCode((c >> 6) | 192);
				utftext += String.fromCharCode((c & 63) | 128);
			}
			else {
				utftext += String.fromCharCode((c >> 12) | 224);
				utftext += String.fromCharCode(((c >> 6) & 63) | 128);
				utftext += String.fromCharCode((c & 63) | 128);
			}

		}

		return utftext;
	},

	// private method for UTF-8 decoding
	_utf8_decode : function (utftext) {
		var string = "";
		var i = 0;
		var c = c1 = c2 = 0;

		while ( i < utftext.length ) {

			c = utftext.charCodeAt(i);

			if (c < 128) {
				string += String.fromCharCode(c);
				i++;
			}
			else if((c > 191) && (c < 224)) {
				c2 = utftext.charCodeAt(i+1);
				string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
				i += 2;
			}
			else {
				c2 = utftext.charCodeAt(i+1);
				c3 = utftext.charCodeAt(i+2);
				string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
				i += 3;
			}

		}

		return string;
	}

}

Articulos relacionados

• Tildes en Javascript (0)
• ucfirst de PHP en Javascript (0)
• Enviar el log de errores de PHP por email (0)
• Obtener la URL que se esta visitando con PHP (0)
• Comprobar DNI / NIF con PHP (3)
• La función str_replace() de PHP en Javascript (1)
• Comprobar la validez de un dominio con PHP (1)
• str_replace() de PHP en Javascript (0)
• Aprender jQuery, 1: Qué és y por qué usarlo. (0)
• Recursividad en mkdir de PHP (0)

$cadena = 'Prefiero el helado de frutas del bosque';
echo $cadena;
// Prefiero el helado de frutas del bosque

$cadena = str_replace('frutas del bosque','pistacho',$cadena);
echo $cadena;
// Prefiero el helado de pistacho

Más información sobre str_replace() en la página de PHP.

Para hacerlo en Javascript se haría así:

cadena = 'Prefiero el helado de frutas del bosque';
alert(cadena);
// Prefiero el helado de frutas del bosque

cadena = cadena.replace(/frutas del bosque/g,"pistacho");
alert(cadena);
// Prefiero el helado de pistacho

Si sólo se quiere cambiar la primera coincidencia, en vez de utilizar /frutas del bosque/g debería ser "frutas del bosque". El cambio entre //g y "" es aparentemente absurdo y me ha costado varias horas de trabajo… pero de errores se aprende.

Articulos relacionados

• ucfirst de PHP en Javascript (0)
• Detectar petición AJAX con PHP (1)
• PHP: Ordenar array por el valor de un campo (0)
• Comprobar si un directorio está vacío con PHP (0)
• Comprobar validez de un dominio con PHP (2) (0)
• Tildes en Javascript (0)
• Base64 (encode y decode) en Javascript (3)
• Enviar el log de errores de PHP por email (0)
• Obtener la URL que se esta visitando con PHP (0)
• Comprobar DNI / NIF con PHP (3)

Por ejemplo para cambiar un guión bajo por un espacio:

// En ocasasiones puede interesar utilizar nbsp en vez de un espacio
cadena = cadena.replace(/_/g," ");
// El mismo ejemplo con un espacio normal
cadena = cadena.replace(/_/g," ");

Ese ejemplo es utilizando expresiones regulares, pero también se puede utilizar con porciones de cadena:

cadena = 'Buenos tiempos';
cadena = cadena.replace("Buenos","Malos");
alert(cadena); // Mostraría "Malos tiempos"

Recomiendo visitar esta página para aprender a utilizar las expresiones regulares de javascript y leer los comentarios de este articulo para entender mejor el uso de replace. Antes de que me crucifiquen, ya sé que este articulo es muy simple y no explica con demasiada amplitud el uso de replace (de ahí que proponga dos enlaces para entenderlo mejor).

Articulos relacionados

• Obtener la URL que se esta visitando con PHP (0)
• Comprobar la validez de un dominio con PHP (1)
• Eliminar posición de un array en PHP (2)
• Retrasar eventos y efectos de jQuery (0)
• Comprobar estado de un servidor mediante PHP (1)
• RegEx I, sólo letras, números y espacios. (0)
• PHP: Cookies (0)
• ucfirst de PHP en Javascript (0)
• Tildes en Javascript (0)
• Base64 (encode y decode) en Javascript (3)

jQuery es una librería de JavaScript, rápida y concisa que simplifica el tratamiento de documentos HTML, el control de eventos, animaciones, e interacciones AJAX para un desarrollo web rápido. jQuery está diseñado para cambiar la manera en que se escribe JavaScript.

Así (pero en inglés traducido por mi, espero que bien) es como se describe jQuery en la portada de su página oficial.

Aunque haya quien diga que no, yo creo que jQuery es una de las herramientas (por llamarlo de alguna manera) mejor documentadas que hay. Con un mínimo de interés y un poco de imaginación se puede entender rápidamente para qué sirve e imaginar en qué se podría aplicar. Eso sin contar la gran cantidad de recursos y ejemplos que existen, incluso en la misma documentación oficial de la librería. Así que en realidad, ni siquiera hace falta imaginación para entenderlo.

Por qué usarlo

Después de usar jQuery, pensar en dejar de utilizarlo y tener que escribir JavaScript sin algún framework (ya sea jQuery, mootools o cualquier otro) me parece una locura. En sério, sólo de pensar en verme obligado a usar XMLHttpRequest para los temas de AJAX y no poder recurrir a jQuery empiezo a idear excusas para evitarlo.

Y sii no te fias, puedes tener la certeza de que es una librería de calidad, y para demostrarlo en su portada nos recuerdan que Google, Dell, Digg, Technorati, Mozilla, WordPress, Drupal y una infinidad más de sitios utilizan su framework.

Por ejemplo, para hacer una carga de página externa con ajax, usando jQuery sería algo así:

$("#idcapa").load('url/relativa/fichero.php');

Y hacer algo parecido con JavaScript llano sería:

XHConn - Simple XMLHTTP Interface - bfults@gmail.com - 2005-04-08
Code licensed under Creative Commons Attribution-ShareAlike License

http://creativecommons.org/licenses/by-sa/2.0/

*/
function XHConn(){
  var xmlhttp, bComplete = false;
  try { xmlhttp = new ActiveXObject("Msxml2.XMLHTTP"); }
  catch (e) { try { xmlhttp = new ActiveXObject("Microsoft.XMLHTTP"); }
  catch (e) { try { xmlhttp = new XMLHttpRequest(); }
  catch (e) { xmlhttp = false; }}}
  if (!xmlhttp) return null;
  this.connect = function(sURL, sMethod, sVars, fnDone) {
    if (!xmlhttp) return false;
    bComplete = false;
    sMethod = sMethod.toUpperCase();
    try {
      if (sMethod == "GET"){
        xmlhttp.open(sMethod, sURL+"?"+sVars, true);
        sVars = "";
      }else{
        xmlhttp.open(sMethod, sURL, true);
        xmlhttp.setRequestHeader("Method", "POST "+sURL+" HTTP/1.1");
        xmlhttp.setRequestHeader("Content-Type",
          "application/x-www-form-urlencoded");
      }
      xmlhttp.onreadystatechange = function(){
        if (xmlhttp.readyState == 4 && !bComplete){
          bComplete = true;
          fnDone(xmlhttp);
        }};
      xmlhttp.send(sVars);
    }
    catch(z) { return false; }
    return true;
  };
  return this;
}

var myConn = new XHConn();
if (!myConn) alert("XMLHTTP not available. Try a newer/better browser.");
var include_terminado = function (oXML) { document.getElementById('include').innerHTML = oXML.responseText; };
function include_dinamico (url){
	document.getElementById('include').innerHTML = "";
	myConn.connect("include.php", "GET", "variable="+url, include_terminado);
}

<a onclick="include_dinamico('hola');" href="#">Link</a>

Además de AJAX, jQuery trabaja con animaciones, DOM, eventos, y permite el uso de plug-ins. Y aunque la sintaxis pueda parecer extraña al principio, es bastante sencilla de entender y cuando se hacen un par de ejercicios en plan “copiar, pegar y modificar” se entiende rápidamente como funciona.

Y cuando me apetezca (dentro de un rato, mañana o quizá nunca), explicaré la sintaxis y otras cosas “importantes”.

Articulos relacionados

• Detectar petición AJAX con PHP (1)
• ucfirst de PHP en Javascript (0)
• Tildes en Javascript (0)
• Base64 (encode y decode) en Javascript (3)
• La función str_replace() de PHP en Javascript (1)
• str_replace() de PHP en Javascript (0)
• PNGfix.js para Internet Explorer (0)
• Retrasar eventos y efectos de jQuery (0)

Para detectarlo se utiliza la variable de servidor $_SERVER['HTTP_X_REQUESTED_WITH']:

if(
   !empty($_SERVER['HTTP_X_REQUESTED_WITH']) &&
   strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest'
){
   # Ejecuta si la petición es a través de AJAX.
}else{
   # Ejecuta si la petición NO es a través de AJAX.
}

Y poco más que contar.

Articulos relacionados

• ucfirst de PHP en Javascript (0)
• La función str_replace() de PHP en Javascript (1)
• Aprender jQuery, 1: Qué és y por qué usarlo. (0)
• PHP: Ordenar array por el valor de un campo (0)
• Comprobar si un directorio está vacío con PHP (0)
• Comprobar validez de un dominio con PHP (2) (0)
• Tildes en Javascript (0)
• Base64 (encode y decode) en Javascript (3)
• Enviar el log de errores de PHP por email (0)
• Obtener la URL que se esta visitando con PHP (0)

Lo mejor del formato PNG es que permite transparéncias con diferentes niveles del canal alpha (la intensidad de la opacidad), al contrario que el formato GIF que sólo permite alpha 100 o alpha 0. Pero Ningúna versión de Internet Explorer funciona como debería con las opacidades:

• En la versión 6 (lanzado en agosto del 2001) la transparéncia simplemente no existe y muestra la imagen con un extraño color de fondo que no he sabido adivinar de dónde sale.
• En la versión 7 se muestran bien, a no ser que la imagen tenga algún tipo de tratamiento con javascript (cambio de opacidad, …).
• Y la versión 8 viene a comportarse igual de mal que la 7.

En la captura de ejemplo se ve la misma imagen en los tres estados que intento describir. La primera imagen es vista con Internet Explorer 7 y 8 después de tratarla con Javascript. La segunda imagen es vista con cualquier navegador (sin contar versiones de IE anteriores a la 7). Y la tercera imagen es vista con Internet Explorer 6 (y supongo que los inferiores serán igual o peor).

Para solucionar el problema de la tercera imagen se pueden aplicar filtros especificos de Internet Explorer (filter:progid:DXImageTransform.Microsoft.AlphaImageLoader) que corrigen el problema del color de fondo. Pero si ya es suficientemente incómodo tratar incluso las imagenes de formas diferentes según el navegador que se esté utilizando, a una mente brillante se le ocurrió la idea de hacer un tratamiento automático con Javascript, hizo un pequeño script y lo llamó PNGFix.

El uso de PNGfix es muy simple, sólo hay que guardar un archivo .js e incluirlo en el documento que se quiera corregir.

Para incluirlo se utilizan estas lineas, que lo incrustarán sólo si el navegador es inferior a Explorer 7 (por que este ya no lo necesita).

<!--[if lt IE 7]>
<mce:script defer="defer" type="text/javascript" mce_src="pngfix.js"></mce:script>
<![endif]-->

Y el archivo en cuestión (pngfix.js) debería contener algo parecido a esto:

/*
Correctly handle PNG transparency in Win IE 5.5 & 6.
http://homepage.ntlworld.com/bobosola. Updated 18-Jan-2006.
*/

var arVersion = navigator.appVersion.split("MSIE")
var version = parseFloat(arVersion[1])

if ((version >= 5.5) && (document.body.filters))
{
   for(var i=0; i<document.images.length; i++)
   {
      var img = document.images[i]
      var imgName = img.src.toUpperCase()
      if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
      {
         var imgID = (img.id) ? "id='" + img.id + "' " : ""
         var imgClass = (img.className) ? "class='" + img.className + "' " : ""
         var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
         var imgStyle = "display:inline-block;" + img.style.cssText
         if (img.align == "left") imgStyle = "float:left;" + imgStyle
         if (img.align == "right") imgStyle = "float:right;" + imgStyle
         if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
         var strNewHTML = "<span " + imgID + imgClass + imgTitle
         + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
         + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
         + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"
         img.outerHTML = strNewHTML
         i = i-1
      }
   }
}

Explicado esto, sólo me queda alegrarme de que Digg, Facebook y Youtube hayan decidido (por fin) dejar de dar soporte a Internet explorer 6.

Articulos relacionados

• ucfirst de PHP en Javascript (0)
• Tildes en Javascript (0)
• Base64 (encode y decode) en Javascript (3)
• La función str_replace() de PHP en Javascript (1)
• str_replace() de PHP en Javascript (0)
• Aprender jQuery, 1: Qué és y por qué usarlo. (0)
• Detectar petición AJAX con PHP (1)
• inline-block cross-browser (2)
• Retrasar eventos y efectos de jQuery (0)

Por ejemplo:

setTimeout(
   function(){
      //Lo que debe pasar pasados 10 segundos (10mil milisegundos)
   }, 10000);

Es bastante fácil de utilizar, pero si alguien necesita más información puede visitar Klevo Blog, donde he encontrado un articulo que se explica bastante bien… pero esta en inglés.

Articulos relacionados

• str_replace() de PHP en Javascript (0)
• Evento “tab” / “tap” en jQuery (1)
• ucfirst de PHP en Javascript (0)
• Tildes en Javascript (0)
• Base64 (encode y decode) en Javascript (3)
• Obtener la URL que se esta visitando con PHP (0)
• La función str_replace() de PHP en Javascript (1)
• Comprobar la validez de un dominio con PHP (1)
• Hydrax, Skyx y Paradise Engine (1)
• Eliminar posición de un array en PHP (2)