Pinceladas da WebTutoriais sobre: XHTML, CSS, JavaScript e WebStandards

Veja abaixo algumas soluções para retirar espaços do início e final de strings.

Exemplos simples

Exemplo curto (funções com expressão regular):

	//trim completo
	function trim(str) {
		return str.replace(/^\s+|\s+$/g,"");
	}

	//left trim
	function ltrim(str) {
		return str.replace(/^\s+/,"");
	}

	//right trim
	function rtrim(str) {
		return str.replace(/\s+$/,"");
	}

	alert(trim("        TEXTO        "));

Exemplo curto (métodos da string com expressão regular):
Essa solução é bem mais elegante!

	//trim completo
	String.prototype.trim = function () {
		return this.replace(/^\s+|\s+$/g,"");
	}

	//left trim
	String.prototype.ltrim = function () {
		return this.replace(/^\s+/,"");
	}

	//right trim
	String.prototype.rtrim = function () {
		return this.replace(/\s+$/,"");
	}
	alert("        TEXTO        ".trim());

Continuar lendo »

Claramente inspirei o título deste post no outro escrito pelo colega Luiz Paulo. O problema do getElementById no Internet Explorer já é bem conhecido, mas posto aqui, pois muita gente ainda não deve saber.

Como sabemos, a função document.getElementById retorna um elemento da página cujo id é passado como parâmetro. Contudo, o Internet Explorer (até a versão 7) tem uma implementação dessa função um tanto, digamos, controversa.

Na execução dessa função, o IE procura não só por elementos cujo id seja igual ao passado por parâmetro, mas também considera os elementos cujo name seja igual àquele id.

Continuar lendo »

Já estamos cansados de saber que javascript é totalmente dinâmico e podemos mudar facilmente o tipo das variáveis.

Uma das facilidades em javascript é a conversão de variáveis em inteiro, com a função parseInt(). Só que essa função tem uma pegadinha que pode atrapalhar bastante aos desatentos.

Sua sintaxe é bem simples como segue:

var number = "123456348965";
var integerNumber = parseInt(number);
alert(integerNumber); //123456348965

Continuar lendo »

Durante a conferência Google I/O eles fizeram alguns anúncios importantes que passaram despercebidos para algumas pessoas. Algumas pessoas andavam desconfiadas que o Google estava seguindo links JavaScript, mas ninguém até então havia efetuado testes concretos para saber se isso era verdade ou não.

Mas esse novo feito foi revelado por Vanessa Fox de que o Google a partir de agora estaria seguindo links que não seguem os padrões web.

O Google a partir de agora é capaz de acessar o evento onClick na maioria das tags HTML. Caso o evento onClick chame uma função, e em seguida a URL, o GoogleBot só pode interpretá-la se o script faz parte da página, ao invés de um script externo.

Alguns exemplos de código que o GoogleBot pode executar são os seguintes:

    <div onclick="document.location.href='http://foo.com/'"></div>
    <tr onclick="myfunction('index.html')"><a href="#" onclick="myfunction()">new page</a></tr>
    <a href="javascript:void(0)" onclick="window.open('welcome.html')">open new window</a>

Mais informações você pode ver em: JavaScript Links Now Passing PageRank & Anchor Text

O Google que até então parecia um serviço indestrutível não é mais o que parece. Após quedas relatadas no Twitter, o que podemos fazer se dependemos desse serviço? Ainda mais aqueles que dependem da Google AJAX Libraries API para que suas aplicações fucionem.

Recentemente descobri uma alterantiva ao Google AJAX Libraries API, onde caso o serviço esteja off-line, ele utiliza o arquivo JavaScript que está hospedado em seu servidor. Basicamente você teria que criar um arquivo JavaScript e colocá-lo antes do fechamento da tag body:

<script type="text/javascript" src="meu-script-google.js"></script>

O conteúdo desse arquivo deve ser o seguinte:

var sc = document.createElement("script");
sc.type = "text/javascript";
// SRC do Google
sc.src = 'http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js?rand=' + Math.random();
var timer = setTimeout(function(){
   if (typeof jQuery == 'function') return;
        var sc = document.createElement("script");
        sc.type = "text/javascript";
        // SRC local
        sc.src = 'http://www.pinceladasdaweb.com.br/blog/js/jquery-1.3.2.min.js';
        document.getElementsByTagName("head")[0].appendChild(sc);
   // Tempo em milisegundos antes de carregar o arquivo local.
}, 200);

sc.onload = sc.onreadystatechange =  function(e){
    clearTimeout(timer);
}
document.getElementsByTagName("head")[0].appendChild(sc);

É uma ótima alternativa, pois caso o serviço fique indisponível, é carregado um JavaScript alternativo.

Imagem retirada do site de Matthew James Taylor

Quem já não passou pelo problema de que as colunas do site não acompamhavam o tamanho das outras colunas e assim acarretando algumas vezes “quebras de layout”? Pois bem, já postei aqui uma solução não muito bem aceita utilizando CSS, mas dessa vez vamos implementar uma solução com JavaScript e uma outra com a utilização do Framework jQuery.

A primeira solução que utiliza JavaScript puro foi desenvolvida por Matthew Pennell, e o código e sua utilização consistem da seguinte forma. Primeiro você irá precisar de uma função para capturar os elementos da página:

Continuar lendo »

Janko Jovanović, desenvolvedor web localizado em Sérvia e Montenegro e proprietário do blog Janko At Warp Speed desenvolveu um ebook com os melhores tutoriais que ele já escreveu no seu primeiro ano de blog e está o disponibilizando gratuitamente em seu blog.

Continuar lendo »