Javascript 此绝对定位元素未定位在其旁边'；s最近的祖先，而是附加到文档体和I'；我想知道为什么

注意：我无法在TutorialPoint的编码平台或W3TryIt编辑器上复制完整的页面功能，我不喜欢JSFIDLE。我会尝试在这里添加适用的信息，这样你就不必下载网站并打开索引页面。但是如果我的解释不足以说明问题的话，那就是我项目的压缩文件。单击“生成”，然后单击中间的日语字符，可以看到问题

---

问题

我正在工作的网站将日语字符放在左手文本中，然后通过按下生成按钮，在页面中间创建新的元素。br/> 我不打算在这里添加生成函数的代码，因为这篇文章需要多长时间。但下面是显示绝对元素的函数：

setInterval(function (event) {
    $('[id*=jap_word]').click(function () {
        var newId = this.id;
        var toShow = "words_info" + newId.slice(8);
        if (document.getElementById(toShow).style.display == "none") {
            document.getElementById(toShow).style.display = "inline";
        } else {
            document.getElementById(toShow).style.display = "none";
        }
        event.stopImmediatePropagation();
        });
}, 500);

这是Firefox Quantum检查器的图片，显示了创建的元素：

现在，当我单击所选的选择器id并使其内联显示时，它会将words_info元素附加到文档体，而不是最近的祖先

这里引用了w3schools的一句话：

位置：绝对位置

具有位置的元素：绝对；相对于最近定位的祖先定位（而不是相对于视口定位，如固定）

但是,；如果绝对定位元素没有定位的祖先，它将使用文档正文，并随着页面滚动而移动

---

所以我可以看到它的显示是绝对的，我可以看到它在单击jquery选择器后变得可见，我可以看到绝对元素有祖先。有人能帮我找出为什么它不显示在父div旁边吗？

您缺少的部分是：

具有位置的元素：绝对；相对于最近的定位的祖先定位（而不是相对于视口定位，如固定）

words\u info

元素有祖先，但没有任何已定位的祖先（具有

位置：相对的
，
位置：绝对的
，或
位置：固定的
）。所以它默认为：

但是,如果绝对定位元素没有定位的祖先，它将使用文档正文，并随着页面滚动而移动

只需检查-绝对定位子级的父级是否具有
位置：相对？感谢您仔细查看，是的，这似乎是问题所在。