El valor de texto contiene texto de cadena con comillas dobles y apóstrofes como se ve en el ejemplo. cuando imprimo el resultado, cambia a diferentes caracteres.
El texto que proviene de la API es:
"entrada no coincidente 'STARTt' esperando 'START'";
pero cuando lo imprimo, dice:
"no coincide" input="" 'startt'="" expecting="" 'start'=""
Me gustaría imprimir la cadena exactamente como se almacena
var marker = document.createElement("div"); var text = "mismatched input 'STARTt' expecting 'START' "; marker.innerHTML = "<div data-tooltip=" + text+ ">⚠️</div>"; console.log(marker.innerHTML);Necesita envolver el text con comillas.
Esto funciona para mí:
marker.innerHTML = "<div data-tooltip=\"" + text+ "\">⚠️</div>";
Los valores de atributo que contienen espacios deben estar delimitados con " o ' .
Los valores de atributo que contienen ' tienen que estar delimitados con "
Los valores de atributo que contienen " tienen que estar delimitados con ' .
Los valores de atributo que contienen " y ' deben delimitarse con uno de ellos, mientras que el otro debe reemplazarse con la entidad apropiada ( " o ' ).
Tratar de generar HTML mezclando cadenas es buscar problemas cuando cumple con cualquier tipo de requisitos de escape.
no lo hagas Utilice métodos DOM en su lugar.
const marker = document.createElement("div"); const text = "mismatched input 'STARTt' expecting 'START' "; const child = document.createElement('div'); child.setAttribute('data-tooltip', text); child.innerText = "⚠️"; marker.appendChild(child); console.log(marker.innerHTML);Utilice una cadena de plantilla. Debería resolver el problema
var marker = document.createElement("div"); var text = `mismatched input 'STARTt' expecting 'START' `; marker.innerHTML = `<div data-tooltip=" + text+ ">⚠️</div>`; console.log(marker.innerHTML);