我在文档 .write 上加载一个简单的.js文件时发现错误

我写了一个代码，在文档 .write 上发现了一个错误怎么办？

代码是

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
  document.getElementById("demo").document.write=('hi');
}
</script>
</head>
<body>
<h2>JavaScript in Head</h2>
<p id="demo"></p>
<button type="button" onclick="myFunction()">Try it</button>
</body>
</html>

这是错误

Uncaught TypeError: Cannot set property 'write' of undefined
    at myFunction (test1.html:6)
    at HTMLButtonElement.onclick (test1.html:16)
myFunction @ test1.html:6
onclick @ test1.html:16

帮帮我！

问题是：你使用了一些不存在的东西

document.getElementById()返回一个Element，并且Element上没有属性document(即使有，也会让您返回到原始文档(。

所以：

document.getElementById("demo").document === undefined

这就是你的错误所说的。

但是删除它是不够的，因为没有Element.write()

解决方案是使用用作普通字符串的Element.innerHTML或Element.textContent。两者之间的区别在于，innerHTML允许您编写将要呈现的 HTML 标记，同时textContent转义 HTML 标记，以便在源中按原样打印字符串。

innerHTML和textContent示例：

function myFunction1() {
  document.getElementById("demoTextContent").textContent = 'hi';
  document.getElementById("demoInnerHTML").innerHTML = 'hi';
}
function myFunction2() {
  content = document.getElementById("demoTextContent").textContent
  document.getElementById("demoTextContent").textContent = content + 'hi';
  // these to line can also be written as
  // document.getElementById("demoTextContent").textContent += 'hi';
  
  content = document.getElementById("demoInnerHTML").innerHTML
  document.getElementById("demoInnerHTML").innerHTML = content + 'hi';
  // these to line can also be written as
  // document.getElementById("demoInnerHTML").innerHTML += 'hi';
}
function myFunction3() {
  document.getElementById("demoTextContent").textContent = '<span style="background-color:cyan;">hi</span>';
  document.getElementById("demoInnerHTML").innerHTML = '<span style="background-color:cyan;">hi</span>';
}

#demoTextContent::before {content: "textContent: ";}
#demoInnerHTML::before{content:"innerHTML: ";}

<h2>JavaScript in Head</h2>
<p id="demoTextContent"></p>
<p id="demoInnerHTML"></p>
<button type="button" onclick="myFunction1()">Try replace text</button>
<button type="button" onclick="myFunction2()">Try append</button>
<button type="button" onclick="myFunction3()">Try replace by html code</button>

你也写了

write=('hi')

=可能是错别字，但JavaScript会将其读作write = ('hi')稍后被传送到write = 'hi'。

已经有了这样的东西，花了将近一个小时:p找到它。

相关内容

最新更新

热门标签：