warum nicht meine Spannweiten in meinem div zeigen?

stimmen
0

Ich versuche, einige Spannweiten zu zeigen, Inline, als ob sie ein Dokument waren. Allerdings, wenn ich meine span-Tags in meinen div laden, sie erscheinen nicht, obwohl nach der Konsole die div sich die Spannweiten enthält. Nicht sicher, ob ich selbst zusätzliche Parameter der Spannweiten vielleicht werden Einstellung müssen ??

var documentbody = document.getElementById(docbod);

/* turns every word in the document into an element then appends them to the div that contains the doc body */
function splitdocintowords(div) {
  var divarray = []
  var state = [hey, there, how, are, you, doing?]
  for (let i = 0; i < state.length; i++) {
    span = document.createElement(span)
    span.value = state[i]
    span.id = word + i;
    span.classList.add(initialTextcolor)
    div.append(span)
  }
  return div
}


/* highlights a selected word within the document*/
function highlight(selection) {
  console.log(selection, selection)
  let element = document.getElementById(selection.id);
  element.classList.add(highlighted);

}
documentbody.value = splitdocintowords(documentbody)
documentbody.addEventListener(mouseup, highlight(window.getSelection()));
<h2>doc body</h2>
<div id=docbod class=docbody> </div>

Veröffentlicht am 09/10/2019 um 19:01
quelle vom benutzer
In anderen Sprachen...                            


2 antworten

stimmen
-1

Sie span stellen wurden in dem div hängten bekommen, aber sie hat keinen innen Inhalt, da das Attribut „Wert“ gesetzt wurde anstelle von innertext oder innerHTML-

var documentbody = document.getElementById("docbod");

/* turns every word in the document into an element then appends them to the div that contains the doc body */
function splitdocintowords(div) {
  var state = ["hey", "there", "how", "are", "you", "doing?"]
  for (let i = 0; i < state.length; i++) {
    span = document.createElement("span")
    span.innerHTML = state[i]; //use innerText, innerHTML or textContent here
    span.id = "word" + i;
    span.classList.add("initialTextcolor")
    div.appendChild(span)
  }
}


splitdocintowords(documentbody)
<h2>doc body</h2>
<div id="docbod" class="docbody"> </div>

Beantwortet am 09/10/2019 um 19:08
quelle vom benutzer

stimmen
-1

Ändern Sie die span.valuezuspan.innerHTML = state[i]

var documentbody = document.getElementById("docbod");

/* turns every word in the document into an element then appends them to the div that contains the doc body */
function splitdocintowords(div) {
  var divarray = []
  var state = ["hey", "there", "how", "are", "you", "doing?"]
  for (let i = 0; i < state.length; i++) {
    span = document.createElement("span")
    span.innerHTML = state[i]
    span.id = "word" + i;
    span.classList.add("initialTextcolor")
    div.append(span)
  }
  return div
}

/* highlights a selected word within the document*/
function highlight(selection) {
  console.log("selection", selection)
  let element = document.getElementById(selection.id);
  element.classList.add("highlighted");

}
documentbody.value = splitdocintowords(documentbody)
documentbody.addEventListener("mouseup", highlight(window.getSelection()));
#docbod {
  border: 1px solid #000
}
<h2>doc body</h2>
<div id="docbod" class="docbody"> </div>

Beantwortet am 09/10/2019 um 19:06
quelle vom benutzer

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more