为啥从函数调用分配给属性 innerHTML 不起作用？

Posted 2023-05-07

【中文标题】为啥从函数调用分配给属性 innerHTML 不起作用？

【英文标题】：why asignment to property innerHTML from a function call doesnt work?为什么从函数调用分配给属性 innerHTML 不起作用？

【发布时间】：2020-08-10 05:57:29

【问题描述】：

我需要你的帮助。我想调用一个函数并将结果分配给一个元素的内部 html，但它不起作用。 下面是代码：

function abc() 
  var a = document.getElementById("take").value;

  function Ram() 
    document.write("your name is : Ram <br>");
    document.write("your vill/post : Sunsyari <br>");
    document.write("your block is : Betalghat <br>");
    document.write("your Total land is: 5 bega <br>");
  

  if (a == "Ram" || a == "ram") 
    document.getElementById("show").innerHTML = Ram();
   else 
    document.getElementById("show").innerHTML = "wrong credential";
  

请帮忙怎么办？

【问题讨论】：

你应该给.innerHTML分配一个字符串。但是你的Ram 函数返回undefined，所以这是行不通的。需要return "your name is...";

另外，avoid document.write!

尽量避免使用 document.write。几乎没有充分的理由在网页中使用它。您已经将值分配给 innerHTML，因此只需从 Ram() 返回一个字符串。

【参考方案1】：

InnerHTML 属性接受一个字符串，但在您的情况下，您实际上并没有从 Ram 函数返回任何内容。试试下面的 sn -p

function abc() 
  var a = document.getElementById("take").value;

  function Ram() 
    return `your name is : Ram <br>
    your vill/post : Sunsyari <br>
    your block is : Betalghat <br>
    your Total land is: 5 bega <br>`
  
  if (a.toLowerCase()=="ram") 
    document.getElementById("show").innerHTML = Ram();
   else 
    document.getElementById("show").innerHTML = "wrong credential";
  

abc()

#take
background:yellow;

<input value="ram" id="take">
<div id="show"><div>