javascript - 出现错误 : Uncaught TypeError: Cannot read property 'parentNode' of null

Question

我正在尝试添加与一个 div 相邻的新 div，并引用第一个 div 的 ComponentID 我想添加第二个并行 div 喜欢:

<div>
    <div id="userActivityStatusMenu-1110">Neighbor 1</div>
    // want new div here
</div>

下面是我正在尝试的脚本:

/* Adds Element BEFORE NeighborElement */
Element.prototype.appendBefore = function (element) {
element.parentNode.insertBefore(this, element);
}, false;

/* Adds Element AFTER NeighborElement */
Element.prototype.appendAfter = function (element) {
element.parentNode.insertBefore(this, element.nextSibling);
}, false;

/* Typical Creation and Setup A New Orphaned Element Object */
var NewElement = document.createElement('div');
NewElement.innerHTML = 'This is new element';
NewElement.id = 'NewElement';

/*  Add NewElement BEFORE -OR- AFTER Using the Aforementioned Prototypes */
NewElement.appendAfter(getComponent(Ext.getCmp("userActivityStatusMenu-1110").itemId));

请告诉我哪里做错了，或者最好的方法是什么

Answer 1

1. getComponent 不是一个全局函数，而是每个 ExtJS 容器的一个方法
2. someContainer.getComponent 不会返回 DOMElement，而是返回 Ext.Component 或其后代之一

要获取任何 ExtJS 组件的 DOM 节点，您可以将组件本身或组件的 id 传递给 Ext.getDom(idOrComponent)

示例: NewElement.appendAfter(Ext.getDom("userActivityStatusMenu-1110"));

注意:根本不建议使用 id 字段。而是分配一个自定义的、唯一的 itemId 并通过 Ext.ComponentQuery.query('#itemid') 查询组件。

注2:为了完全符合ExtJS的风格，你根本不应该操作内部的HTML结构。相反，要么向父元素添加新项目，要么如果您确实需要插入自定义 HTML，请修改您要在此处修改的任何组件的 html 属性或 XTemplate。