Your problem:

  

And when I load the HTML page and fill in the CPF data, nothing happens, there is no answer.

Instead of function validar () { , use another scope format. In this case, validar = function () { // ... } . See:

validar = function () {
    var formulario = document.getElementById("formulario");
    var cpf = formulario.cpf;
    var email = formulario.email;
    var re_cpf = /^([\d]{3})([\d]{3})([\d]{3})([\d]{2})$/;
    var re_email = /^([\w-]+(\.[\w-]+)*@(([\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(\.[a-z]{2})?)$/i;   

    if(re_cpf.test(cpf.value)){
        alert("CPF válido");}
        else{
            alert("CPF inválido");
    }
}

Example running on jsFiddle .

Still, your next mistake is a problem with the regular expression. I solved it for you:

validar = function () {
    var formulario = document.getElementById("formulario");
    var cpf = formulario.cpf;
    var email = formulario.email;
    var re_cpf = /^([\d]{3})([\d]{3})([\d]{3})([\d]{2})$/;
    var re_email = /^([\w\.\-]+)@([\w\-]+)((\.(\w){2,3})+)$/;   

    if(re_cpf.test(cpf.value)){
        alert("CPF válido");}
        else{
            alert("CPF inválido");
    }

    if(re_email.test(email.value)) alert('E-mail válido');
    else alert('E-mail inválido');
}

Example working in jsFiddle (updated)

Why does not your coiler onclick not trigger validar() ?

Based on a questionnaire made via an OP comment - very good indeed! - I will answer this question with minimalism:

function x () { 
  // do something
};

The above format is called a "function declaration", which in turn is a template where you save the function to be, say, "later" - not in the first instance. As you can see, no variable is signed to it.

Following is the template proposed by me:

x = function () { 
  // do something
};

It is called a "function expression" in literal translation. It means that you sign the " x " function to be used any time%% is executed.

And what's the practical difference?

In your specific case, you are using the observer x "inline" 1 . Its scope is the DOM and will execute a function that already exists the moment the client clicks on the element that you have designated to trigger the function named by you as onclick .

While validar() is a function that "still" does not exist, its effect will not be triggered.

But how come "it does not exist yet"? He exists! I wrote!

There is, but your validar() still does not know who it is. If you write this HTML, <a> will work:

<a href="#" onclick="validar()">Validar que funciona</a>

<script>
    function validar() {
        alert('hello!');
    };
</script>

In your case, you are writing JavaScript in an external file ( function validar() {} ) and therefore, it has not yet been declared to the DOM.

I still do not understand

If you declare a function as previously explained in the same file that you call it, everything will work as expected. As long as you do not do this, the functions must be expressed - explained to the DOM who is who.

To illustrate, take a look at in this jsFiddle . The JavaScript that is on the bottom left will not work while what is embedded in your HTML will do its part - this happens because the JavaScript of this lower white square is "external" to HTML.

For comparison purposes, if you put this content in a js/aula09.js external file:

f = function () {
  alert('Olá!');
};

And put in a file .js this:

<a href="#" onclick="x()">Funciona!</a>
<a href="#" onclick="f()">Também funciona!</a>

<script>
    function x() {
        alert('hello!');
    };
</script>

You'll notice that both will work just like in this other jsFiddle .

1: In this case, "inline" means that you are using JavaScript via HTML in the line of your element - it is not an effect unobtrusive .

I saw here that your code has a problem with the regular expression that you defined in the variable 're_email'. With that the code is breaking and it does not execute your code.

In addition they had some tags that were not closed.

I made the corrections here and now works with the code below. Then take a look at just the expression you created in that variable 're_email', for email validation.

I hope I have helped. Hugs.

            <html>
                <head><script>
                     function validar(){
                        var formulario = document.getElementById("formulario");
                        alert(formulario);
                        var cpf = formulario.cpf.value;
                        alert(cpf);
                        var email = formulario.email.value;
                        alert(email);
                        var re_cpf = /^([\d]{3})([\d]{3})([\d]{3})([\d]{2})$/;

                        if(re_cpf.test(cpf)){
                        alert("CPF válido");
                        } else {
                        alert("CPF inválido");
                        }
                    }
                </script></head>
                <body>
                    <form id="formulario">
                        <fieldset>
                        <legend>Validação e Formatação</legend>
                        <label for="cpf">CPF:</label>
                        <input name="cpf" type="text" />

                        <label for="email">Email:</label>
                        <input name="email" type="text" />

                        <a href="#" onclick="javascript:validar()">Validar</a>
                        </fieldset>
                    </form>
                </body>
            </html>