使用 javascript 与 div 中的文本相比，文本区域的输入

Question

我尝试了以下代码来比较来自 div 元素和来自 textarea 元素的字符串。虽然我在 textarea 中给出了正确的输入，但代码只执行 'else' 语句。请帮助我使用此代码。

function matchIt() {
    var inputstr = (document.getElementById("answerarea")).toString();//textarea element
    var displaystr = (document.getElementById("text")).toString();//div element
    var res = inputstr.localeCompare(displaystr);

    if(res==0)
    {
        alert("you won");
    }  
    else
    {
         alert("you loose");
    }
}

我试过

if(res===0)
(this.(document.getElementById("text"))).toString(); 没有给出输出。

此外，当我尝试使用相同类型的元素（例如 h1 或 p 时，它会给出正确的输出..

Answer 1

您必须从元素中获取值。尝试 value 属性 textarea 和 textContent div.

改变

var inputstr =(document.getElementById("answerarea")).toString();//textarea element
var displaystr = (document.getElementById("text")).toString();//div element

到

var inputstr = document.getElementById("answerarea").value;//textarea element
var displaystr = document.getElementById("text").textContent;//div element

Answer 2

要访问textarea的值，你必须使用.value（它已经是一个字符串），要访问div的文本内容，你应该使用 .textContent 属性.

var inputstr = document.getElementById("answerarea").value; //textarea element
var displaystr = document.getElementById("text").textContent; //div element

无需转换为字符串 - 它们已经是字符串。

此外，不要使用 localeCompare 检查字符串是否相等，只需使用 ===:

var inputstr = document.getElementById("answerarea").value;
var displaystr = document.getElementById("text").textContent; 
console.log(inputstr === displaystr);

<textarea id="answerarea" value="foo">foo</textarea>
<div id="text">foo</div>

使用 javascript 与 div 中的文本相比，文本区域的输入

input of text area compared with text in div using javascript

html

javascript

string

textarea