Question

您好我正在尝试使用getElementById更改html网页中的文本。下面你可以找到我的第一次尝试

<!DOCTYPE html>
<html>
<body>
<h2>Use JavaScript to Change Text</h2>
<p>This example writes "Hello JavaScript!" into an HTML element with id="demo":</p>
<p id="demo"></p>
<script>
    var net     = require('net');
    var sleep   = require('sleep');
    var element = document.getElementById("demo");
    element.innerHTML = "Hello JavaScript!";
</script>

此代码不起作用，因为我可以看到：

使用JavaScript更改文本

此示例编写“Hello JavaScript！”到id =“demo”的HTML元素：

但是： “你好JavaScript！” 不见了。

在js脚本的开头更改变量的位置使代码工作：

<!DOCTYPE html>
<html>
<body>
<h2>Use JavaScript to Change Text</h2>
<p>This example writes "Hello JavaScript!" into an HTML element with id="demo":</p>
<p id="demo"></p>
<script>
    var element = document.getElementById("demo");
    element.innerHTML = "Hello JavaScript!";
    var net     = require('net');
    var sleep   = require('sleep');
</script>

为什么呢？我稍后会在编写代码的其他部分时需要睡眠和网络，但我还需要再次操作“demo”html。

Answer 1

两条线都有问题。 require（）函数不是浏览器识别的客户端函数。通常，require（）用于服务器端NodeJS代码，但是有一个require.js库文件可以添加...

var net     = require('net');
var sleep   = require('sleep');

将此添加到您的项目中： http://requirejs.org/docs/release/2.2.0/minified/require.js

看看这个： http://requirejs.org/docs/api.html

资料来源： Javascript require() function giving ReferenceError: require is not defined

Answer 2

似乎可能是带

的行

var net     = require('net');
var sleep   = require('sleep');

实际上是导致错误，这反过来导致JS停止评估，因此它没有点击getElementById行。您可以在浏览器的开发者工具中，在控制台中查看此内容。

document.getElementById innerHTML在require之后不起作用

2 个答案: