Question

我正在创建一个注释系统，并且需要将星星放在模板文字中，目的是使星星数量保持在人名旁边。到目前为止，该值向我显示“未定义” 截图screenshot comment system

这是JavaScript代码

const txtNombre = document.getElementById("text-nombre");
const txtParrafo = document.getElementById("text-area");
const boton = document.getElementById("btnAgregar");
const listado = document.getElementById("contenedor-filas");
const radio = document.getElementsByName("rate");

boton.addEventListener("click", agregarALista);

function agregarALista() {
    let nombre = txtNombre.value;
    var valor = txtParrafo.value;

    const elHtml = document.createElement("div");

    elHtml.innerHTML = `
    <div class="row" id="fila-segunda">
        <div class = "col-6">
            ${nombre}
        </div>

        <div class = "col-6">
            ${estrellitas()}
        </div>
    </div>

    <div class="row" id="fila-tercera">
        <div class = "col">
            ${valor}
        </div>
    </div>
    `;
    listado.appendChild(elHtml);

    txtNombre.value = "";
    txtParrafo.value = "";
}




let estrellitas = function() {
    radio.forEach(function(elementos) {
        if (elementos.checked) {
            estrellas = document.createElement("h3");
            estrellas.setAttribute("class", "stars");
            let s = "";
            for (i = 0; i < elementos.value; i++) {
                s += "★";
            }
            estrellas.textContent = s;
            listado.appendChild(estrellas);
        }
    });
}

Answer 1

您的函数estrellitas()缺少return语句，因此将返回undefined。否则，将函数返回值包含在字符串模板文字中的语法是正确的：

let x = (a, b) => a > b;
let a = 10, b = 20;
console.log(`${a} is greater than ${b}? ${x(a, b)}`);

如何将函数的值放在模板文字中？

1 个答案: