I’m having a hard time understanding the logic

Asked

Viewed 210 times

4

Problem:

Create a fonts() function that receives as input any sentence. Then write in the body of this page phrase using fonts of different sizes (from 1 to 7). For this, you should make a loop that will repeat the following TAG, changing only the attribute "size":

Can someone help me understand the logic?

javascript
  • 2

    What have you tried? Which part didn’t work? What feature are you having problems with (loop? tag? set font size? create the role?)?

  • 1

    What is your doubt?

  • 1

    Ever tried something? If yes put the code, if not try you will only get something by trying and erring!

  • 1

    Hello @user8919, welcome to [so.pt]. I recommend a reading on [help] especially on the topic [Ask].

  • 1

    This question seems to be out of context because it is about an exercise in logic which, apparently, the user does not even have a base code to be aided. You just want the "fish ready".

2 answers

6


The logic is:

  • create a function called fontes which receives as input any sentence

Here is a minimalist example of function

function fontes(frase){
    alert(frase); // só para verificar
};
  • write this sentence in the body of the page using fonts of different sizes (from 1 to 7)

Here you need to "fetch" the body of the page and store in a variable:

var corpo = document.querySelector('body'); // ou outro elemento que queira
  • For this, you must make a loop that will repeat the following TAG by changing only the attribute "size"

Now a for typical loop is

for (var i = 1; i < 8; i++) {
   // fazer qq coisa
}

In this case, inside the loop you have to change the css/style of the text. Here comes a step that is not closed in the question: how to package the phrase? with a div, <p> or <span>? snatch.

If you use a <p> the code inside the loop could be:

corpo.innerHTML += '<p style="font-size: '+i+'em;">'+frase+'</p>';

Example: http://jsfiddle.net/r6VY4/

Final code:

function fontes(frase) {
    var corpo = document.querySelector('body');
    for (var i = 1; i < 8; i++) {
        corpo.innerHTML += '<p style="font-size: ' + i + 'em;">' + frase + '</p>';
    }
};
fontes('Olá mundo!');
  • 2

    Many thanks Sergio <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>/title> </head> <body> <script> Function fonts(phrase) { var body = Document.querySelector('body'); var phrase = prompt("Type a sentence",""); for (var i = 1; i < 7; i++) { body.innerHTML += '<p style="font-size: ' + i + 'em;">' + phrase + '</p>'; } fonts(); </script> </body> </html> I lacked material and example to do so there was not even a starting point . I could understand and what I needed most was the formula for !

  • 1

    @user8919, if solved the problem you can choose one of the answers as correct. Note that in the code that put in your comment for makes a loop less. Or starts in 1 and makes <8 or else <=7, as you have (var i = 1; i < 7; i++) it will do only 6 loops.

4

You can create N elements, but as not specified, I will leave in example with the element font:

function fontes(frase){
    for(var i = 1; i <= 7; i++){ // laço para criar os elementos
      var e = document.createElement('font'); // cria um elemento font
      e.setAttribute("size",i); // altera o atributo size
      e.innerHTML = frase; // adiciona a frase no elemento
      document.body.appendChild(e); // adiciona no body
    }
}
fontes('Stackoverflow '); // chama a função

Jsfiddle example

Browser other questions tagged javascript

You are not signed in. Login or sign up in order to post.