Javascript 如何在页面加载时进行敲除以填充数据

我正在使用Knockout构建一个HTML表

        <!-- ko foreach: currentPageQuestions -->
                <tr>
                    <td class="question-item" data-bind="html:questionText"></td>
                </tr>
                <!-- /ko -->

由于表未完全加载，DataTables脚本在页面加载时未找到任何元素，也未对其进行分页

当我通过点击“查看源代码”来查看HTML时，我看到了相同的HTML（带有敲除代码），对于可观察集合中的所有元素，没有TRs或TDs

不过，当我“检查元件”时，我可以看到所有的TR和TDs

所以，我想知道在触发document.ready函数调用中的代码之前，是否有方法使数据可用

---

提前感谢。

我建议您使用绑定处理程序来执行此操作，它将更易于维护，并且数据源中的任何更改都将反映在视图中，请参见下面代码段中的示例：

ko.bindingHandlers.dataTablesForEach={
页码：0，
init:function（元素、valueAccessor、allBindingsAccessor、viewModel、bindingContext）{
var options=ko.unwrap（valueAccessor（））；
ko.展开（选项.数据）；
if（options.dataTableOptions.paging）{
valueAccessor（）.data.subscribe（函数（更改）{
var table=$（元素）。最近（'table'）。DataTable（）；
ko.bindingHandlers.dataTablesForEach.page=表.page（）；
表1.destroy（）；
}，null，'arrayChange'）；
}
var节点=Array.prototype.slice.call（element.childNodes，0）；
ko.utils.arrayForEach（节点，函数（节点）{
if（node&&node.nodeType！==1）{
node.parentNode.removeChild（节点）；
}
});
返回ko.bindingHandlers.foreach.init（元素、valueAccessor、allBindingsAccessor、viewModel、bindingContext）；
},
更新：函数（元素、valueAccessor、allBindings、viewModel、bindingContext）{
var options=ko.unwrap（valueAccessor（）），
key='DataTablesForEach_Initialized'；
ko.展开（选项.数据）；
var表；
如果（！options.dataTableOptions.paging）{
table=$（元素）.closest（'table'）.DataTable（）；
表1.destroy（）；
}
update（元素、valueAccessor、allBindings、viewModel、bindingContext）；
table=$（元素）.closest（'table'）.DataTable（选项.dataTableOptions）；
if（options.dataTableOptions.paging）{
if（table.page.info（）.pages-ko.bindingHandlers.dataTablesForEach.page==0）
table.page（--ko.bindingHandlers.dataTablesForEach.page）.draw（false）；
其他的
page（ko.bindingHandlers.dataTablesForEach.page）.draw（false）；
}        
if（！ko.utils.domData.get（元素，键）&（options.data | | options.length））
ko.utils.domData.set（元素，键，true）；
返回{ControlsDescentBindings:true}；
}
}; 
//个人视图模型
var Person=功能（数据，父级）{
var=这个；
this.id=data.id；
this.isEdit=ko.可观察（假）；
this.first=ko.可观察（data.first）；
this.last=ko.可观察（data.last）；
this.age=ko.可观察（data.age）；
this.editbuttonext=ko.computed（函数（）{
返回该.isEdit（）？“保存”：“编辑”；
});
this.full=ko.computed（函数（）{
返回此.first（）+“”+此.last（）；
}，这个）；
//向侦听器订阅表的可观察属性
//并在数据表行更改时使其无效，以便重新绘制
};
//主视图模型
var ViewModel=新函数（）{
var=这个；
this.people=ko.mapping.fromJS（[]）；
this.inline=ko.可观察（真）；
this.add=函数（）{
$（'dialog'）。dialog（'open'）；
};
this.getEditMode=ko.computed（函数（）{
返回该.inline（）？'（inline）:'（Dialog）'；
});
this.remove=功能（人员、事件）{
那。人。移走（人）；
};
this.removeAll=函数（人员、事件）{
那。人。移除所有（）；
};
this.edit=功能（人员、事件）{
如果（that.inline（））{
if（person.isEdit（））{
person.isEdit（假）；
}
否则{
that.people（）.forEach（函数（p）{
if（p.isEdit（））{
p、 iEdit（假）；
}
});
person.isEdit（真）；
}
}否则{
$（'editdialog'）.data（'id'，person.id）；
$（'#editName'）.val（person.first（））；
$（'#editLast'）.val（person.last（））；
$（'#editAge'）.val（person.age（））；
$（'editdialog'）。dialog（'open'）；
}
};
};
var计数=3；
//初始数据集
风险值数据=[{
id:1，
第一个：“艾伦”，
最后一句：“怡和”，
年龄:86
}, {
id:2，
第一个：“鲍勃”，
最后：“史密斯”，
年龄:54
}, {
id:3，
第一个：“吉米”，
最后：“琼斯”，
年龄:32
}];
$（文档）.ready（函数（）{
//将数据集转换为可观察对象，并将添加
//表中的初始数据
ko.mapping.fromJS(
数据{
键：功能（数据）{
返回ko.utils.unwrapobbservable（data.id）；
},
创建：函数（选项）{
返回新人员（options.data、ViewModel）；
}
},
ViewModel.people）；
$（'#dialog'）。dialog({
莫代尔：是的，
自动打开：错误，
身高：350，
宽度：460，
按钮：{
“添加人”：函数（）{
ViewModel.people.push（新人物）({
id:++计数，
第一个：$（'#Name'）.val（），
last:$（'#last'）.val（），
年龄：$（“#年龄”）.val（）
}，V
    $(document).ready(function(){
        $('#dataTableQuestions').DataTable();
    });