elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Tutorial básico de Quickjs


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  [HTML][javascript] ¿Cómo crear "variables" para usarlas luego en el html?
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] 2 Ir Abajo Respuesta Imprimir
Autor Tema: [HTML][javascript] ¿Cómo crear "variables" para usarlas luego en el html?  (Leído 7,093 veces)
.:Xx4NG3LxX:.

Desconectado Desconectado

Mensajes: 203



Ver Perfil WWW
[HTML][javascript] ¿Cómo crear "variables" para usarlas luego en el html?
« en: 13 Julio 2020, 06:28 am »

Saludos!

Ya llevo un tiempo con el desarrollo web, y me estoy metiendo de a poco en javascript.

Mi pregunta recae, en que yo quiero hacer variables (o algo así), me explico;

Por ejemplo: Quiero que al tener en el body de la página:

Código
  1. ...
  2.  
  3. <p>{SALUDO}, bienvenido</p>
  4.  
  5. ..

Reemplaze {SALUDO} por "Hola usuario" (por ejemplo)...

En resumen, crear variables para usarlas luego en la página HTML

Creo que me explique terrible, pero es lo que se me vino a la mente... Gracias de antemano...!


En línea

"Quizá Batch no sea un lenguaje de programación, pero no obstante deja de ser útil. Asi que no anden diciendo «Que ganas de perder el tiempo»"
Agente Naranja


Desconectado Desconectado

Mensajes: 535


uguu~


Ver Perfil WWW
Re: [HTML][javascript] ¿Cómo crear "variables" para usarlas luego en el html?
« Respuesta #1 en: 13 Julio 2020, 06:37 am »

Que yo sepa, no puedes hacerlo de la forma que quieres. Lo que podrías hacer es crear un código javascript que te recupere todas las cadenas que estén dentro de llaves y luego reemplazarlas. Lo que yo haría por ejemplo sería dar a los elementos una clase especial, como class="procesar_plantilla", luego recuperas todos los elementos con esta clase, document.querySelectorAll('.procesar_plantilla'), y buscas dentro del HTML para reemplazar las cadenas que comiencen con { y terminen con }.

Esa sería mi forma de solucionar este problema, pero quizás alguien tiene otra sugerencia.


En línea

.:Xx4NG3LxX:.

Desconectado Desconectado

Mensajes: 203



Ver Perfil WWW
Re: [HTML][javascript] ¿Cómo crear "variables" para usarlas luego en el html?
« Respuesta #2 en: 13 Julio 2020, 06:42 am »

Muchísimas gracias por la pronta respuesta!

¿Cómo se haría el proceso de búsqueda para reemplazar las palabras que empiezan y terminen en llaves?
En línea

"Quizá Batch no sea un lenguaje de programación, pero no obstante deja de ser útil. Asi que no anden diciendo «Que ganas de perder el tiempo»"
@XSStringManolo
Hacker/Programador
Colaborador
***
Desconectado Desconectado

Mensajes: 2.399


Turn off the red ligth


Ver Perfil WWW
Re: [HTML][javascript] ¿Cómo crear "variables" para usarlas luego en el html?
« Respuesta #3 en: 13 Julio 2020, 07:33 am »

Muchísimas gracias por la pronta respuesta!

¿Cómo se haría el proceso de búsqueda para reemplazar las palabras que empiezan y terminen en llaves?
Se conoce como mustache sintax. No es trivial la implementación. Usa un lib ya creada. http://archan937.github.io/templayed.js/

Hay otro tipo de templates que te pueden servir.
En línea

Mi perfil de patrocinadores de GitHub está activo! Puedes patrocinarme para apoyar mi trabajo de código abierto 💖

.:Xx4NG3LxX:.

Desconectado Desconectado

Mensajes: 203



Ver Perfil WWW
Re: [HTML][javascript] ¿Cómo crear "variables" para usarlas luego en el html?
« Respuesta #4 en: 13 Julio 2020, 07:55 am »

Eso está bien pero no hay algo más sencillo y manual... Lo quiero más que todo de aprendizaje... Para analizar el código y entenderlo..

(Igual me lo guardo, esta interesante, gracias)
En línea

"Quizá Batch no sea un lenguaje de programación, pero no obstante deja de ser útil. Asi que no anden diciendo «Que ganas de perder el tiempo»"
[u]nsigned


Desconectado Desconectado

Mensajes: 2.397

JS/Node developer


Ver Perfil WWW
Re: [HTML][javascript] ¿Cómo crear "variables" para usarlas luego en el html?
« Respuesta #5 en: 13 Julio 2020, 10:15 am »

Cuando empiezas a tener este tipo de inquietudes lo mejor es pasarse a un framework js de una vez, te recomiendo empezar con Vue que es progresivo y podes ir adoptando de a poco. No solo te permite usar variables, sino que además es reactivo.
En línea

No hay atajo ante la duda, el misterio se hace aquí...
Se hace carne en cada uno, el misterio es existir!
EdePC
Moderador Global
***
Desconectado Desconectado

Mensajes: 2.156



Ver Perfil
Re: [HTML][javascript] ¿Cómo crear "variables" para usarlas luego en el html?
« Respuesta #6 en: 13 Julio 2020, 18:09 pm »

Saludos,

- El uso de una librería o framework es directamente proporcional a la complejidad del proyecto. Si tu proyecto es muy pequeño y sencillo puedes valerte con lo convencional, por ejemplo se puede utilizar código javascript en medio del código html de la siguiente manera:

Código
  1. <script>
  2.  var saludo = "Hola usuario";
  3. </script>
  4.  
  5. <p><script>document.write(saludo)</script>, bienvenido</p>

-- Da como resultado:

Código:
Hola usuario, bienvenido

- Las otras formas como la de Buscar y Reemplazar, usar una librería o framework ya lo comentaron mensajes arriba.
En línea

vicram10

Desconectado Desconectado

Mensajes: 12


Vive la vida como yo lo hago Estilo HitenMitsurugi


Ver Perfil WWW
Re: [HTML][javascript] ¿Cómo crear "variables" para usarlas luego en el html?
« Respuesta #7 en: 13 Julio 2020, 20:49 pm »

Claro, asi como comentaron, depende exclusivamente de lo que uno quiere hacer (complejidad del proyecto), en este caso lo mencionado por EdePC sería lo mas rapido, tambien se puede analizar frameworks tipo Twig que te permite hacer algo parecido.
En línea

.:Xx4NG3LxX:.

Desconectado Desconectado

Mensajes: 203



Ver Perfil WWW
Re: [HTML][javascript] ¿Cómo crear "variables" para usarlas luego en el html?
« Respuesta #8 en: 18 Julio 2020, 06:09 am »

Muchas gracias a todos y disculpen la inactividad...

Ahora mismo es un proyecto pequeño, es más, ni es un proyecto es una serie de pruebas para aprender... Me han sacado de una duda, muchas gracias!

Cualquier otro comentario es bien recibido...!!!
En línea

"Quizá Batch no sea un lenguaje de programación, pero no obstante deja de ser útil. Asi que no anden diciendo «Que ganas de perder el tiempo»"
EdePC
Moderador Global
***
Desconectado Desconectado

Mensajes: 2.156



Ver Perfil
Re: [HTML][javascript] ¿Cómo crear "variables" para usarlas luego en el html?
« Respuesta #9 en: 18 Julio 2020, 15:35 pm »

Como ya recomendaron arriba, si quieres ir familiarizándote con un framework muy bien se puede empezar por VUE.JS porque en un principio se puede utilizar como una Librería de un solo archivo, luego para proyectos mucho más complejos se puede utilizar con Vue CLI para administrarlos.

Puedes ver este excelente video que justamente presenta a un curso de Vue, pero de hecho ya con lo que muestra puedes resolver tu problema, esta presentación muestra como usar Vue como librería:



- El curso es de pago y es el actual 2020, además está más enfocado a Vue CLI, sin embargo yo tomé el curso del 2018 por Jhon Mircha que en un principio se enfoca bastante en Vue como librería, muy simple, sencillo y directo tal cual muestra en vídeo de introducción sin instalar IDEs ni dependencias de cientos de megas.

-- Por ejemplo Vue CLI requiere node.js, agregar el vue CLI, etc, quedando el proyecto completo con varias decenas de megas  :xD

- Puedes acceder gratuitamente a los primeros vídeos del curso que muestra el vídeo desde su página web: https://ed.team/cursos/vue/
En línea

Páginas: [1] 2 Ir Arriba Respuesta Imprimir 

Ir a:  

WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines