使用createTextNode方法附加用戶輸入的文本

Question

現在，我正在嘗試找出如何根據用戶在輸入文本字段中輸入的內容將CREATED文本附加到CREATED p元素上。 如果我在createTextElement方法之后設置文本，則在單擊按鈕時它顯示得很好。 但是我想要的是：用戶在輸入字段中輸入文本，然后單擊按鈕，將文本添加到id為“ mydiv”的div標簽的末尾。 任何幫助表示贊賞。

HTML：

<body>
    <div id="mydiv">
        <p>Hi There</p>
        <p>How are you?</p>
        <p>
            <input type="text" id="myresponse">
            <br>
            <input type="button" id="showresponse" value="Show Response">
        </p>
        <hr>
    </div>
</body>

JAVASCRIPT：

var $ = function(id) {
    return document.getElementById(id)
}

var feelings = function()
{    
    $("myresponse").focus();

    var mypara = document.createElement("p");
    var myparent = $("mydiv");

    myparent.appendChild(mypara);

    var myText = document.createTextNode($("myresponse").value);

    mypara.setAttribute("id", "displayedresponse");

    mypara.appendChild(myText);

    $("displayedresponse").appendChild(myText);    
}

window.onload = function() {

    $("showresponse").onclick = feelings;
}

Answer 1

您需要將一個參數應用於createTextNode函數
您需要讀取輸入字段的值，以便可以看到文本。

由於您每次點擊都會引用mydiv ，因此我認為將mydiv變量移至父范圍會更適合您

 var $ = function (id) { return document.getElementById(id) } let mydiv = $('mydiv'); $("showresponse").addEventListener('click', feelings); function feelings() { let textInput = $('myresponse').value; var mypara = document.createElement("p"); var myText = document.createTextNode(textInput); mypara.setAttribute("id", "displayedresponse"); mypara.appendChild(myText); mydiv.appendChild(mypara); $("displayedresponse").appendChild(myText); }

使用createTextNode方法附加用戶輸入的文本

問題描述

1 個解決方案

解決方案1
2 已采納 2017-11-19 22:00:55

使用createTextNode方法附加用戶輸入的文本

問題描述

1 個解決方案

解決方案1 2 已采納 2017-11-19 22:00:55

解決方案1
2 已采納 2017-11-19 22:00:55