Tengo cinco variables, cada una de las cuales contiene un elemento div editable. Quiero crear un objeto con cinco propiedades y luego asignar estas propiedades al texto interno de las cinco variables.
let firstName = document.querySelector(".firstName").innerHTML let secondName = document.querySelector(".secondName").innerHTML let marsName = document.querySelector(".marsName").innerHTML let email = document.querySelector(".phoneOrEmail").innerHTML let password = document.querySelector(".password").innerHTML let All_is_well = document.querySelector(".allIsWell"); All_is_well.addEventListener("click", () => { let form = { firstName, secondName, marsName, email, password, } fetch( "http:localhost:5000/api/register", { method: "POST", body: JSON.stringify(form), headers: { "Content-Type": "application/json" }, cache: 'no-cache' } ) .then(res.json()) .then((data) => { // Handle response console.log("Success: ", res); }) .catch((error) => { // Handle error console.log("Error: ", error); }); console.log(form); }); <form> <div class="comment"> install your landed spaceship on mars </div> <div class="firstName" contenteditable="true" spellcheck="false"> </div> <div class="secondName" contenteditable="true" spellcheck="false"> </div> <div class="marsName" contenteditable="true" spellcheck="false"> </div> <div class="phoneOrEmail" contenteditable="true" spellcheck="false"> </div> <div class="password" contenteditable="true" spellcheck="false"> </div> <button type="submit" class="allIsWell"> All is Well </button> </form>cuando imprimo el objeto en la consola, a cada propiedad se le asigna un valor " ".
¿Sus divs tienen las clases correctas?
Asegúrese de guardar los valores después de editar los divs.
Por ejemplo, haciendo clic en el botón "Guardar".
document.getElementById("save").addEventListener("click", () => { let first = document.querySelector(".element1").innerText; let second = document.querySelector(".element2").innerText; let third = document.querySelector(".element3").innerText; let props = {}; props.first = first; props.second = second; props.third = third; console.log(props); // returns the right values for me });