Skip to main content
se eliminaron 1136 caracteres en el cuerpo
Origen Enlace
Marcos
  • 35.6k
  • 7
  • 36
  • 70

estoyEstoy intentando desarrollar el"El juego del ahorcadoahorcado" en jsjs con funciones, por ahora tengo una palabra al azar de la array que e creado, una funcion que oculta esa palabra por guiones, hasta hay bien. No logro que al seleccionar la letra y que cuando coincida esa letra con una de la palabra oculta se cambie el guion por la letra. e encontrado un metodo de replaceAT pero creo que es muy rebuscado y no se si funciona. Estoy un poco bloqueado probando cosas que no funcionan.

estoy intentando desarrollar el juego del ahorcado en js con funciones, porPor ahora tengo una palabra al azar de la array que ehe creado, una funcionfunción que oculta esa palabra por guiones, hasta hayahí bien. 

No logro que al seleccionar la letra y que cuando coincida esa letra con una de la palabra oculta se cambie el guion por la letra. eHe encontrado un metodométodo de replaceATreplaceAT pero creo que es muy rebuscado y no se si funciona. 

Estoy un poco bloqueado probando cosas que no funcionan.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Hangman</title>
</head>
<body>
    <section class="contenedorsection">
        <div class="contenedor">
        <div class="title">HANGMAN</div>
        <section class="categoriascont">
            <div class="categorias">categorias</div>
        </section>

        <section class="contletraspadre">
            <div id="printletra" class="contletras"></div>
            <div class="dibujohangman"></div>
        </section>
        <section class="contletfalladas">
            <div class="letfalladas"></div>
        </section>
        <section>
            <div id="teclado">
                <button  type="button" class="key" value="Q" style="border-style: outset;">Q</button>
                <button  type="button" class="key" value="W" style="border-style: outset;">W</button>
                <button  type="button" class="key" value="E" style="border-style: outset;">E</button>
                <button  type="button" class="key" value="R" style="border-style: outset;">R</button>
                <button  type="button" class="key" value="T" style="border-style: outset;">T</button>
                <button  type="button" class="key" value="Y" style="border-style: outset;">Y</button>
                <button  type="button" class="key" value="U" style="border-style: outset;">U</button>
                <button  type="button" class="key" value="I" style="border-style: outset;">I</button>
                <button  type="button" class="key" value="O" style="border-style: outset;">O</button>
                <button  type="button" class="key" value="P" style="border-style: outset;">P</button>
                <br>
                <button  type="button" class="key" value="A" style="border-style: outset;">A</button>
                <button  type="button" class="key" value="S" style="border-style: outset;">S</button>
                <button  type="button" class="key" value="D" style="border-style: outset;">D</button>
                <button  type="button" class="key" value="F" style="border-style: outset;">F</button>
                <button  type="button" class="key" value="G" style="border-style: outset;">G</button>
                <button  type="button" class="key" value="H" style="border-style: outset;">H</button>
                <button  type="button" class="key" value="J" style="border-style: outset;">J</button>
                <button  type="button" class="key" value="L" style="border-style: outset;">L</button>
                <button  type="button" class="key" value="K" style="border-style: outset;">K</button>
                <button  type="button" class="key" value="Ñ" style="border-style: outset;">Ñ</button>
                <br>
                <button  type="button" class="key" value="Z" style="border-style: outset;">Z</button>
                <button  type="button" class="key" value="X" style="border-style: outset;">X</button>
                <button  type="button" class="key" value="C" style="border-style: outset;">C</button>
                <button  type="button" class="key" value="V" style="border-style: outset;">V</button>
                <button  type="button" class="key" value="B" style="border-style: outset;">B</button>
                <button  type="button" class="key" value="N" style="border-style: outset;">N</button>
                <button  type="button" class="key" value="M" style="border-style: outset;">M</button>
              </div>
        </section>
        
        
    </div>
   
    </section>
 <script src="./index.js"></script>
  
</body>
</html>


        let words = ['elefante', 'futbolista', 'cocinera', 'payaso'];
        let word = words[Math.floor(Math.random() * words.length)];
        let replaceWord;
        
        
        // funcion para ocultar palabra y que se vean guiones y aparezca en el Dom.
        function secretWord() {
            replaceWord = word.replace(/./g, "_ ");
            let printletra = document.getElementById('printletra');
            printletra.innerHTML = replaceWord;
            //alert(replaceWord)
        }
     
        secretWord();
        
        // funcion para printar letra si se ha hacertado
        function printLetter() {
                let replacescript = document.getElementById('teclado');
                replacescript.addEventListener('click', (e) => {
                let letra = e.target.value;
                String.prototype.replaceAt = function (index, character) { return this.substr(0, index) + character + this.substr(index + character.length); }
                
                for (let i in replaceWord) {
                    if (letra === replaceWord[i]) {
                          replaceWord = replaceWord.replaceAt(i * 2, letra);
                          console.log(letra)
                          return replaceWord;
                    
                    }
                    
                }
                    document.getElementById('printletra').innerHTML = replaceWord;
                    console.log(replaceWord)
            });
           
        }
        printLetter()

let words = ['elefante', 'futbolista', 'cocinera', 'payaso'];
let word = words[Math.floor(Math.random() * words.length)];
let replaceWord;


// funcion para ocultar palabra y que se vean guiones y aparezca en el Dom.
function secretWord() {
  replaceWord = word.replace(/./g, "_ ");
  let printletra = document.getElementById('printletra');
  printletra.innerHTML = replaceWord;
  //alert(replaceWord)
}

secretWord();

// funcion para printar letra si se ha hacertado
function printLetter() {
  let replacescript = document.getElementById('teclado');
  replacescript.addEventListener('click', (e) => {
    let letra = e.target.value;
    String.prototype.replaceAt = function(index, character) {
      return this.substr(0, index) + character + this.substr(index + character.length);
    }

    for (let i in replaceWord) {
      if (letra === replaceWord[i]) {
        replaceWord = replaceWord.replaceAt(i * 2, letra);
        console.log(letra)
        return replaceWord;

      }

    }
    document.getElementById('printletra').innerHTML = replaceWord;
    console.log(replaceWord)
  });

}
printLetter()
<section class="contenedorsection">
  <div class="contenedor">
    <div class="title">HANGMAN</div>
    <section class="categoriascont">
      <div class="categorias">categorias</div>
    </section>

    <section class="contletraspadre">
      <div id="printletra" class="contletras"></div>
      <div class="dibujohangman"></div>
    </section>
    <section class="contletfalladas">
      <div class="letfalladas"></div>
    </section>
    <section>
      <div id="teclado">
        <button type="button" class="key" value="Q" style="border-style: outset;">Q</button>
        <button type="button" class="key" value="W" style="border-style: outset;">W</button>
        <button type="button" class="key" value="E" style="border-style: outset;">E</button>
        <button type="button" class="key" value="R" style="border-style: outset;">R</button>
        <button type="button" class="key" value="T" style="border-style: outset;">T</button>
        <button type="button" class="key" value="Y" style="border-style: outset;">Y</button>
        <button type="button" class="key" value="U" style="border-style: outset;">U</button>
        <button type="button" class="key" value="I" style="border-style: outset;">I</button>
        <button type="button" class="key" value="O" style="border-style: outset;">O</button>
        <button type="button" class="key" value="P" style="border-style: outset;">P</button>
        <br>
        <button type="button" class="key" value="A" style="border-style: outset;">A</button>
        <button type="button" class="key" value="S" style="border-style: outset;">S</button>
        <button type="button" class="key" value="D" style="border-style: outset;">D</button>
        <button type="button" class="key" value="F" style="border-style: outset;">F</button>
        <button type="button" class="key" value="G" style="border-style: outset;">G</button>
        <button type="button" class="key" value="H" style="border-style: outset;">H</button>
        <button type="button" class="key" value="J" style="border-style: outset;">J</button>
        <button type="button" class="key" value="L" style="border-style: outset;">L</button>
        <button type="button" class="key" value="K" style="border-style: outset;">K</button>
        <button type="button" class="key" value="Ñ" style="border-style: outset;">Ñ</button>
        <br>
        <button type="button" class="key" value="Z" style="border-style: outset;">Z</button>
        <button type="button" class="key" value="X" style="border-style: outset;">X</button>
        <button type="button" class="key" value="C" style="border-style: outset;">C</button>
        <button type="button" class="key" value="V" style="border-style: outset;">V</button>
        <button type="button" class="key" value="B" style="border-style: outset;">B</button>
        <button type="button" class="key" value="N" style="border-style: outset;">N</button>
        <button type="button" class="key" value="M" style="border-style: outset;">M</button>
      </div>
    </section>


  </div>

</section>

estoy intentando desarrollar el juego del ahorcado en js con funciones, por ahora tengo una palabra al azar de la array que e creado, una funcion que oculta esa palabra por guiones, hasta hay bien. No logro que al seleccionar la letra y que cuando coincida esa letra con una de la palabra oculta se cambie el guion por la letra. e encontrado un metodo de replaceAT pero creo que es muy rebuscado y no se si funciona. Estoy un poco bloqueado probando cosas que no funcionan.

estoy intentando desarrollar el juego del ahorcado en js con funciones, por ahora tengo una palabra al azar de la array que e creado, una funcion que oculta esa palabra por guiones, hasta hay bien. No logro que al seleccionar la letra y que cuando coincida esa letra con una de la palabra oculta se cambie el guion por la letra. e encontrado un metodo de replaceAT pero creo que es muy rebuscado y no se si funciona. Estoy un poco bloqueado probando cosas que no funcionan.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Hangman</title>
</head>
<body>
    <section class="contenedorsection">
        <div class="contenedor">
        <div class="title">HANGMAN</div>
        <section class="categoriascont">
            <div class="categorias">categorias</div>
        </section>

        <section class="contletraspadre">
            <div id="printletra" class="contletras"></div>
            <div class="dibujohangman"></div>
        </section>
        <section class="contletfalladas">
            <div class="letfalladas"></div>
        </section>
        <section>
            <div id="teclado">
                <button  type="button" class="key" value="Q" style="border-style: outset;">Q</button>
                <button  type="button" class="key" value="W" style="border-style: outset;">W</button>
                <button  type="button" class="key" value="E" style="border-style: outset;">E</button>
                <button  type="button" class="key" value="R" style="border-style: outset;">R</button>
                <button  type="button" class="key" value="T" style="border-style: outset;">T</button>
                <button  type="button" class="key" value="Y" style="border-style: outset;">Y</button>
                <button  type="button" class="key" value="U" style="border-style: outset;">U</button>
                <button  type="button" class="key" value="I" style="border-style: outset;">I</button>
                <button  type="button" class="key" value="O" style="border-style: outset;">O</button>
                <button  type="button" class="key" value="P" style="border-style: outset;">P</button>
                <br>
                <button  type="button" class="key" value="A" style="border-style: outset;">A</button>
                <button  type="button" class="key" value="S" style="border-style: outset;">S</button>
                <button  type="button" class="key" value="D" style="border-style: outset;">D</button>
                <button  type="button" class="key" value="F" style="border-style: outset;">F</button>
                <button  type="button" class="key" value="G" style="border-style: outset;">G</button>
                <button  type="button" class="key" value="H" style="border-style: outset;">H</button>
                <button  type="button" class="key" value="J" style="border-style: outset;">J</button>
                <button  type="button" class="key" value="L" style="border-style: outset;">L</button>
                <button  type="button" class="key" value="K" style="border-style: outset;">K</button>
                <button  type="button" class="key" value="Ñ" style="border-style: outset;">Ñ</button>
                <br>
                <button  type="button" class="key" value="Z" style="border-style: outset;">Z</button>
                <button  type="button" class="key" value="X" style="border-style: outset;">X</button>
                <button  type="button" class="key" value="C" style="border-style: outset;">C</button>
                <button  type="button" class="key" value="V" style="border-style: outset;">V</button>
                <button  type="button" class="key" value="B" style="border-style: outset;">B</button>
                <button  type="button" class="key" value="N" style="border-style: outset;">N</button>
                <button  type="button" class="key" value="M" style="border-style: outset;">M</button>
              </div>
        </section>
        
        
    </div>
   
    </section>
 <script src="./index.js"></script>
  
</body>
</html>


        let words = ['elefante', 'futbolista', 'cocinera', 'payaso'];
        let word = words[Math.floor(Math.random() * words.length)];
        let replaceWord;
        
        
        // funcion para ocultar palabra y que se vean guiones y aparezca en el Dom.
        function secretWord() {
            replaceWord = word.replace(/./g, "_ ");
            let printletra = document.getElementById('printletra');
            printletra.innerHTML = replaceWord;
            //alert(replaceWord)
        }
     
        secretWord();
        
        // funcion para printar letra si se ha hacertado
        function printLetter() {
                let replacescript = document.getElementById('teclado');
                replacescript.addEventListener('click', (e) => {
                let letra = e.target.value;
                String.prototype.replaceAt = function (index, character) { return this.substr(0, index) + character + this.substr(index + character.length); }
                
                for (let i in replaceWord) {
                    if (letra === replaceWord[i]) {
                          replaceWord = replaceWord.replaceAt(i * 2, letra);
                          console.log(letra)
                          return replaceWord;
                    
                    }
                    
                }
                    document.getElementById('printletra').innerHTML = replaceWord;
                    console.log(replaceWord)
            });
           
        }
        printLetter()

Estoy intentando desarrollar "El juego del ahorcado" en js con funciones.

Por ahora tengo una palabra al azar de la array que he creado, una función que oculta esa palabra por guiones, hasta ahí bien. 

No logro que al seleccionar la letra y que cuando coincida esa letra con una de la palabra oculta se cambie el guion por la letra. He encontrado un método de replaceAT pero creo que es muy rebuscado y no se si funciona. 

Estoy un poco bloqueado probando cosas que no funcionan.

let words = ['elefante', 'futbolista', 'cocinera', 'payaso'];
let word = words[Math.floor(Math.random() * words.length)];
let replaceWord;


// funcion para ocultar palabra y que se vean guiones y aparezca en el Dom.
function secretWord() {
  replaceWord = word.replace(/./g, "_ ");
  let printletra = document.getElementById('printletra');
  printletra.innerHTML = replaceWord;
  //alert(replaceWord)
}

secretWord();

// funcion para printar letra si se ha hacertado
function printLetter() {
  let replacescript = document.getElementById('teclado');
  replacescript.addEventListener('click', (e) => {
    let letra = e.target.value;
    String.prototype.replaceAt = function(index, character) {
      return this.substr(0, index) + character + this.substr(index + character.length);
    }

    for (let i in replaceWord) {
      if (letra === replaceWord[i]) {
        replaceWord = replaceWord.replaceAt(i * 2, letra);
        console.log(letra)
        return replaceWord;

      }

    }
    document.getElementById('printletra').innerHTML = replaceWord;
    console.log(replaceWord)
  });

}
printLetter()
<section class="contenedorsection">
  <div class="contenedor">
    <div class="title">HANGMAN</div>
    <section class="categoriascont">
      <div class="categorias">categorias</div>
    </section>

    <section class="contletraspadre">
      <div id="printletra" class="contletras"></div>
      <div class="dibujohangman"></div>
    </section>
    <section class="contletfalladas">
      <div class="letfalladas"></div>
    </section>
    <section>
      <div id="teclado">
        <button type="button" class="key" value="Q" style="border-style: outset;">Q</button>
        <button type="button" class="key" value="W" style="border-style: outset;">W</button>
        <button type="button" class="key" value="E" style="border-style: outset;">E</button>
        <button type="button" class="key" value="R" style="border-style: outset;">R</button>
        <button type="button" class="key" value="T" style="border-style: outset;">T</button>
        <button type="button" class="key" value="Y" style="border-style: outset;">Y</button>
        <button type="button" class="key" value="U" style="border-style: outset;">U</button>
        <button type="button" class="key" value="I" style="border-style: outset;">I</button>
        <button type="button" class="key" value="O" style="border-style: outset;">O</button>
        <button type="button" class="key" value="P" style="border-style: outset;">P</button>
        <br>
        <button type="button" class="key" value="A" style="border-style: outset;">A</button>
        <button type="button" class="key" value="S" style="border-style: outset;">S</button>
        <button type="button" class="key" value="D" style="border-style: outset;">D</button>
        <button type="button" class="key" value="F" style="border-style: outset;">F</button>
        <button type="button" class="key" value="G" style="border-style: outset;">G</button>
        <button type="button" class="key" value="H" style="border-style: outset;">H</button>
        <button type="button" class="key" value="J" style="border-style: outset;">J</button>
        <button type="button" class="key" value="L" style="border-style: outset;">L</button>
        <button type="button" class="key" value="K" style="border-style: outset;">K</button>
        <button type="button" class="key" value="Ñ" style="border-style: outset;">Ñ</button>
        <br>
        <button type="button" class="key" value="Z" style="border-style: outset;">Z</button>
        <button type="button" class="key" value="X" style="border-style: outset;">X</button>
        <button type="button" class="key" value="C" style="border-style: outset;">C</button>
        <button type="button" class="key" value="V" style="border-style: outset;">V</button>
        <button type="button" class="key" value="B" style="border-style: outset;">B</button>
        <button type="button" class="key" value="N" style="border-style: outset;">N</button>
        <button type="button" class="key" value="M" style="border-style: outset;">M</button>
      </div>
    </section>


  </div>

</section>

Origen Enlace

como cambiar palabra reemplazada por guiones por letras

estoy intentando desarrollar el juego del ahorcado en js con funciones, por ahora tengo una palabra al azar de la array que e creado, una funcion que oculta esa palabra por guiones, hasta hay bien. No logro que al seleccionar la letra y que cuando coincida esa letra con una de la palabra oculta se cambie el guion por la letra. e encontrado un metodo de replaceAT pero creo que es muy rebuscado y no se si funciona. Estoy un poco bloqueado probando cosas que no funcionan.

estoy intentando desarrollar el juego del ahorcado en js con funciones, por ahora tengo una palabra al azar de la array que e creado, una funcion que oculta esa palabra por guiones, hasta hay bien. No logro que al seleccionar la letra y que cuando coincida esa letra con una de la palabra oculta se cambie el guion por la letra. e encontrado un metodo de replaceAT pero creo que es muy rebuscado y no se si funciona. Estoy un poco bloqueado probando cosas que no funcionan.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="style.css">
    <title>Hangman</title>
</head>
<body>
    <section class="contenedorsection">
        <div class="contenedor">
        <div class="title">HANGMAN</div>
        <section class="categoriascont">
            <div class="categorias">categorias</div>
        </section>

        <section class="contletraspadre">
            <div id="printletra" class="contletras"></div>
            <div class="dibujohangman"></div>
        </section>
        <section class="contletfalladas">
            <div class="letfalladas"></div>
        </section>
        <section>
            <div id="teclado">
                <button  type="button" class="key" value="Q" style="border-style: outset;">Q</button>
                <button  type="button" class="key" value="W" style="border-style: outset;">W</button>
                <button  type="button" class="key" value="E" style="border-style: outset;">E</button>
                <button  type="button" class="key" value="R" style="border-style: outset;">R</button>
                <button  type="button" class="key" value="T" style="border-style: outset;">T</button>
                <button  type="button" class="key" value="Y" style="border-style: outset;">Y</button>
                <button  type="button" class="key" value="U" style="border-style: outset;">U</button>
                <button  type="button" class="key" value="I" style="border-style: outset;">I</button>
                <button  type="button" class="key" value="O" style="border-style: outset;">O</button>
                <button  type="button" class="key" value="P" style="border-style: outset;">P</button>
                <br>
                <button  type="button" class="key" value="A" style="border-style: outset;">A</button>
                <button  type="button" class="key" value="S" style="border-style: outset;">S</button>
                <button  type="button" class="key" value="D" style="border-style: outset;">D</button>
                <button  type="button" class="key" value="F" style="border-style: outset;">F</button>
                <button  type="button" class="key" value="G" style="border-style: outset;">G</button>
                <button  type="button" class="key" value="H" style="border-style: outset;">H</button>
                <button  type="button" class="key" value="J" style="border-style: outset;">J</button>
                <button  type="button" class="key" value="L" style="border-style: outset;">L</button>
                <button  type="button" class="key" value="K" style="border-style: outset;">K</button>
                <button  type="button" class="key" value="Ñ" style="border-style: outset;">Ñ</button>
                <br>
                <button  type="button" class="key" value="Z" style="border-style: outset;">Z</button>
                <button  type="button" class="key" value="X" style="border-style: outset;">X</button>
                <button  type="button" class="key" value="C" style="border-style: outset;">C</button>
                <button  type="button" class="key" value="V" style="border-style: outset;">V</button>
                <button  type="button" class="key" value="B" style="border-style: outset;">B</button>
                <button  type="button" class="key" value="N" style="border-style: outset;">N</button>
                <button  type="button" class="key" value="M" style="border-style: outset;">M</button>
              </div>
        </section>
        
        
    </div>
   
    </section>
 <script src="./index.js"></script>
  
</body>
</html>


        let words = ['elefante', 'futbolista', 'cocinera', 'payaso'];
        let word = words[Math.floor(Math.random() * words.length)];
        let replaceWord;
        
        
        // funcion para ocultar palabra y que se vean guiones y aparezca en el Dom.
        function secretWord() {
            replaceWord = word.replace(/./g, "_ ");
            let printletra = document.getElementById('printletra');
            printletra.innerHTML = replaceWord;
            //alert(replaceWord)
        }
     
        secretWord();
        
        // funcion para printar letra si se ha hacertado
        function printLetter() {
                let replacescript = document.getElementById('teclado');
                replacescript.addEventListener('click', (e) => {
                let letra = e.target.value;
                String.prototype.replaceAt = function (index, character) { return this.substr(0, index) + character + this.substr(index + character.length); }
                
                for (let i in replaceWord) {
                    if (letra === replaceWord[i]) {
                          replaceWord = replaceWord.replaceAt(i * 2, letra);
                          console.log(letra)
                          return replaceWord;
                    
                    }
                    
                }
                    document.getElementById('printletra').innerHTML = replaceWord;
                    console.log(replaceWord)
            });
           
        }
        printLetter()