¿Cómo puedo obtener el valor '123' del siguiente código? Pensé que el fragmento debería funcionar, pero en su lugar recibo un correo electrónico:....
<div id="home"> <div class="name" my-data="123">Email: test@gmail.com</div> </div> var element = document.querySelector('.element'); var dataAttribute = element.getAttribute('my-data'); console.log(dataAttribute);Intenta usar querySelector con .element , esa clase no existe, en su lugar necesita usar .name
var element = document.querySelector('.name'); var dataAttribute = element.getAttribute('my-data'); console.log(dataAttribute); <div id="home"> <div class="name" my-data="123">Email: test@gmail.com</div> </div> Solo para su conocimiento, podría usar data-attribute como este:
var element = document.querySelector('.name'); var dataAttribute = element.getAttribute('data-email'); console.log(dataAttribute); <div id="home"> <div class="name" data-email="123">Email: test@gmail.com</div> </div>Referencia:
Para elegir el texto del correo electrónico div, use textContent como:
var element = document.querySelector('.name'); var dataAttribute = element.getAttribute('my-data'); console.log(dataAttribute, element.textContent); <div id="home"> <div class="name" my-data="123">Email: test@gmail.com</div> </div>Referencia:
Cuando utilice un atributo personalizado, asegúrese de escribir "datos-" y luego el resto del nombre del atributo. Al hacer eso, puede acceder fácilmente a los datos desde javascript.
<div class="name" data-something="123">Email: test@gmail.com</div>Y para el js:
let element = document.querySelector('.name') let dataAttribute = element.dataset.something