Función que muestra las dimensiones de un elemento

Por hacer unas pruebas con estos métodos, vamos a comenzar creando una función que muestra en una caja de alerta las dimensiones de un elemento cuyo selector se envíe por parámetro. A la función enviaremos el selector y luego con jQuery mostraremos sus valores de anchura y altura, tanto de la parte interior del elemento (innerWidth e innerHeight), como del elemento completo con su borde (outerWidth y outerHeight).

function dimensionCapa(capa){

capa = $(capa);

var dimensiones = "";

dimensiones += "Dimensiones internas: " + capa.innerWidth() + "x" + capa.innerHeight();

dimensiones += "\nDimensiones externas: " + capa.outerWidth() + "x" + capa.outerHeight();

alert(dimensiones);

}

Como decíamos, las dimensiones externas toman en cuenta el borde del elemento, si es que tiene, y las dimensiones internas no toman en cuenta el posible borde.