Wie div neben Eingabe-Tag anhängen

Ich habe ein Eingabefeld, das ich so erstellt habe.Wie div neben Eingabe-Tag anhängen

Ich möchte das div mit Pfeilbild direkt nach dem Text hinzufügen, aber es ist nicht apparieren. div wird erschaffen, aber es geht abwärts.

var newDiv = document.createElement("div"); 

newDiv.setAttribute("class", "Arrow"); 
//sortDiv.style.display = ' transform: rotate(45deg), webkit-transform: rotate(45deg);'*/ 
newDiv.setAttribute("onclick",'divClick("title")'); 
newDiv.style.background = "red"; 
newDiv.style.width = "10px"; 
newDiv.style.height = "10px";

Hier ist das Bild.

Ich möchte nach dem Text hinzufügen. Jede Lösung hierfür.

Quelle

2017-11-02 David

, wenn Sie etwas Inline hinzufügen möchten Warum verwenden Sie ein div (== ein Blockelement) und nicht eine Spanne? – cloned

Soll ich "span" hier verwenden – David

Ja, span hat eine Inline-Anzeige, während div eine Blockanzeige hat (css weise). Ändern Sie Ihren Code: var newDiv = document.createElement ("div"); => var newSpan = document.createElement ("span"); und aktualisiere den Rest deines Codes. –

Hier ist die grundlegende Beispiel, wie div Element nach Eingabe hinzufügen,
können Sie ändern (und Stil), wie Sie es wünschen:

var root = document.getElementById("root"), 
 
    checkbox = document.createElement("input"), 
 
    block = document.createElement("div"); 
 

 
checkbox.type = "checkbox"; 
 
checkbox.value = "title"; 
 

 
block.className = "arrow"; 
 
block.setAttribute("onclick",'divClick("title")'); 
 
block.style.background = "red"; 
 
block.style.display = "inline-block"; 
 
block.style.width = "36px"; 
 
block.style.height = "12px"; 
 

 
root.appendChild(checkbox); 
 
root.appendChild(block); 
 

 
function divClick(text){ 
 
    console.log('you had just clicked the ' + text); 
 
}

<div id="root" class="form-group"></div>

Quelle

2017-11-02 07:41:41

Wie div neben Eingabe-Tag anhängen

Antwort

Verwandte Themen