Question

我不知道为什么“li”秒（class="desc"）总是空的。为什么我不能为它设置innerHTML，而我可以为第一个li 标签设置innerHTML。如果我使用：

e.parentElement.children[0].innerHTML = "abc";

<== 然后它工作正常。如何修复此错误？。这是我的完整代码：

<!DOCTYPE html>
<html>
<body>
<button type="button" onclick="loadDoc()">Get Content</button>
<div id="demo"></div>
<script>
function loadDoc() {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        var oglasiHTML = '<div id="select">' +
                '<ul>' +
                    '<li><a href="javascript:void(0);" onclick="return readmore(\'https://api.github.com/search/repositories?q=imdb+language:PHP\',this);">readmore</a></li>' +
                    '<li class="desc"></li>' +
                '</ul>' +
            '</div>';
      document.getElementById("demo").innerHTML = oglasiHTML;
    }
  };
  xhttp.open("GET", "https://api.github.com/search/repositories?q=imdb+language:PHP", true);
  xhttp.send();
}
function readmore(url,e) {
  var xhttp = new XMLHttpRequest();
  xhttp.onreadystatechange = function() {
    if (this.readyState == 4 && this.status == 200) {
        e.parentElement.children[1].innerHTML = "abc";
    }
  };
  xhttp.open("GET", url, true);
  xhttp.send();
}
</script>
</body>
</html>

Answer 1

它不起作用，因为 e.parentElement 返回 li 节点。使用 Node.nextSibling 获取下一个 li 节点：

if (this.readyState == 4 && this.status == 200) {
    e.parentElement.nextSibling.innerHTML = "abc"; //--> <li class="desc"></li>
}

Answer 2

e.parentElement.parentElement.children[1].innerHTML = "abc";

e 是你当前的元素；即a a 的父级是 li。

现在li只有一个孩子a

当前 li 的父项是 ul。

现在ul有两个孩子。

你可以为它增值

未捕获的类型错误：调用 XMLHttpRequest 时无法设置属性“innerHTML”

2 个答案: