我在另一个自定义元素(编辑表(中有一个自定义元素(输入日期(。当我去将值分配给输入日期时，在"设置值"类成员函数中，我记录：
console.log(this)
打印出元素
<input-date id="cell" style="height: 100%; width: 300px;">
<input id="input" placeholder="mm/dd/yyyy, hh:mm am/pm" style="font-family: "Open Sans", sans-serif; height: 100%; width: 100%; text-align: left; font-size: 18px; border: 2px; border-radius: 5px; padding: 5px;">
</input-date>
但是当我这样做时
console.log(this.children);
和
console.log(this.querySelector('#input'));
我得到"空"。
带有"this"的函数在我的输入日期类的"设置值"内
class InputDate extends HTMLElement
{
...
connectedCallback()
{
var input = document.createElement('Input');
input.id = 'input';
this.appendChild(input);
}
set value(val)
{
//val should be a date object
var i = this.querySelector('#input');
if(i && val)
{
i.value = val.toLocaleString();
}
console.log(i,val,this, this.childNodes);
}
...
customElements.define('input-date',InputDate);
注意：此外，如果相关，则my_date.value = some_date;(调用"set value"类成员函数的部分(发生在从XMLHTTPRequest到API的完成块中。
输入日期是在另一个称为编辑表的自定义元素中创建的。
所以我在"编辑表"中设置了用户
get_users(function(r)
{
if(r.hasOwnProperty('error_message'))
{
alert(r.error_message);
}
else
{
var table = document.getElementById('edit-table');
table.users = r.users;
}
});
然后在"编辑表"设置用户"下，我创建一个"输入日期"元素并尝试从服务器分配日期，(即 2017 年 2 月 8 日星期三 00：00：00 GMT-0500(
class EditUsers extends HTMLElement
...
set users(users)
{
...
var check = document.createElement('input-date');
check.value = new Date('Wed Feb 08 2017 00:00:00 GMT-0500');
}
customElements.define('edit-table',EditTable);
}
有什么想法吗？
哇！简直不敢相信。多年来我一直在犯这个错误，并且仍在这样做......
我需要在做之前对我的自定义元素进行"追加子">
my_element.value = new Date();
因为在调用"appendChild"之前，"connectedCallback(("还没有被调用，因此"input"元素还没有附加到我的自定义元素中，因此"querySelector"还找不到子元素。
谢谢@mickers，我不想陷入细节，但这就是发生的事情。希望能帮助别人