Question

我需要将输入到此输入中的任何单词作为每个行/元素上的一个单词的有序列表在div中吐出（onclick）。 1.如何告诉函数将单词放入列表中（我知道我必须以某种方式将它们拆分，但我不知道该怎么做）2。如何在列表之后将列表输入div？只有Javascript请。谢谢！

编辑：启动一个函数，现在如何让它将拆分放入ul然后将其放入div中？我的var分割也是为了得到输入框的输入吗？

<script>
function function1()
{
var split= document.getElementById('theInput').value.split(' ')
var var1 = split[0];
var var2 = split [1];
var var3 = split [2];
}
</script>
<h1 id="header">The document header.</h1>
<img id="theImage" src="http://www.uiowa.edu/homepage/images/dome-wm-mobile.gif">
<p>Value: <input type="text" id="theInput" value="" size=10>
<input type="button" id="theButton" value="click me!" onclick="function1"></p>
<ul id="theList">
<li id="element1">Element 1
<li id="element2">Element 2
<li id="element3">Element 3
</ul>
<div id="theDiv"></div>

Answer 1

希望这就是你要找的东西

function splitText()
{
    var textString = document.getElementById("splitText").value;

    var stringArray = new Array();
    stringArray = textString.split(" ");

    var outputString = "<ul>";
    for (i = 0; i < stringArray.length; i++) {
        outputString += "<li>"+ stringArray[i] + "</li>";
    }
    outputString += "</ul>";
    document.getElementById("output").innerHTML = outputString;
}

这是HTML代码

<input id="splitText" type='text'/>
  <div id='output' style='width:100px;height:100px;border: 1px solid' onclick='splitText()'>

Answer 2

Here you go

标记：

<p>Input:<input type="text" id="theInput" value="" size=10>
<input type="button" id="button1" value="click" onclick="function1();"></p>
<ul id="theList">
</ul>
<div id="div1"></div>

JavaScript的：

function function1() {
    var words = document.getElementById("theInput").value.split(" ");
    console.log(words.length);
    for(var i = 0; i < words.length; ++i) {
        var obj = document.createElement('li');
        obj.id = "list"+i;
        obj.innerHTML = words[i];
        document.getElementById("theList").appendChild(obj);
    }
}

友情提示：考虑制定您的命名惯例！

如何将输入的句子输入到ul列表中

2 个答案: