有没有办法在特定的div中加载用javascript生成的html？

我有一个javascript函数，可以生成一些html内容。 但是，我使用的事件侦听器将在页面末尾加载内容。*我希望将其加载到特定的div中

    window.addEventListener("DOMContentLoaded", (event) => {
    createForm(<?php echo json_encode($training_array, JSON_PRETTY_PRINT) ?>);
});

window.addEventListener（“DOMContentLoaded”，（事件）=>{
createForm（）；
});

我还在div中尝试了onload属性。。。但stll不起作用：

<div id="bdd"onload="createForm(<?php echo json_encode($training_array, JSON_PRETTY_PRINT) ?>);"></div>

---

您可以使用
元素.innerHTML
来执行此操作

您可以使用
元素.innerHTML
来执行此操作

将
docuemnt.getElementById
和
innerHTML
结合起来应该可以做到这一点


document.getElementById（“内容”）.innerHTML=“此处的内容”
将
docuemnt.getElementById
和
innerHTML
结合起来应该可以达到这个目的


document.getElementById（“内容”）.innerHTML=“此处的内容”

找到了答案

基本上，正如大家所说，“回归”是不存在的！只是想知道该放在哪里

function createForm(arr){

ct++;
de++;
na++;

const form = document.getElementById("formed");
const divi = document.getElementById("bdd");
arr.forEach(element => {   
    const a = element.training_diploma;
    const b = element.training_school;
    const c = element.training_level;
    const d = element.training_start_date;
    const e = element.training_end_date;

    const training_diploma = document.createElement('input');
    training_diploma.setAttribute('value', a)
    training_diploma.setAttribute('name','saved_training['.concat(ct,'][training_diploma]'))
    training_diploma.required = true

    const training_school = document.createElement('input');
    training_school.setAttribute('value', b)
    training_school.setAttribute('name','saved_training['.concat(ct,'][training_school]'))
    training_school.required = true

    const divSelect = document.createElement('div');
    divSelect.setAttribute('class', 'select')

    const training_level = document.createElement('select');
    training_level.setAttribute('value', c)
    training_level.setAttribute('id', 'rec_mode')
    training_level.setAttribute('name','saved_training['.concat(ct,'][training_level]'))
    training_level.required = true  

        const option1 = document.createElement('option');
        option1.disabled = true
        option1.innerHTML='-- Type de diplôme --';

        const option2 = document.createElement('option');
        option2.innerHTML='Formation' 
        if (option2.innerHTML == c) {
            option2.selected = true
        } 

        const option3 = document.createElement('option');
        option3.innerHTML='Brevet'
        if (option3.innerHTML == c) {
            option3.selected = true
        } 
        const option4 = document.createElement('option');
        option4.innerHTML='Bac'
        if (option4.innerHTML == c) {
            option4.selected = true
        } 
        const option5 = document.createElement('option');
        option5.innerHTML='Bac +1'
        if (option5.innerHTML == c) {
            option5.selected = true
        } 
        const option6 = document.createElement('option');
        option6.innerHTML='Bac +2'
        if (option6.innerHTML == c) {
            option6.selected = true
        } 
        const option7 = document.createElement('option');
        option7.innerHTML='Bac +3'
        if (option7.innerHTML == c) {
            option7.selected = true
        } 
        const option8 = document.createElement('option');
        option8.innerHTML='Bac +4'
        if (option8.innerHTML == c) {
            option8.selected = true
        } 
        const option9 = document.createElement('option');
        option9.innerHTML='Bac +5'
        if (option9.innerHTML == c) {
            option9.selected = true
        } 

        const option10 = document.createElement('option');
        option10.innerHTML='Doctorat'
        if (option10.innerHTML == c) {
            option10.selected = true
        } 

    const training_start_date = document.createElement('input');
    training_start_date.setAttribute('type', 'month')
    training_start_date.setAttribute('value', d)
    training_start_date.setAttribute('name','saved_training['.concat(ct,'][training_start_date]'))
    training_start_date.required = true

    const training_end_date = document.createElement('input');
    training_end_date.setAttribute('type', 'month')
    training_end_date.setAttribute('value', e)
    training_end_date.setAttribute('name','saved_training['.concat(ct,'][training_end_date]'))
    training_end_date.required = true

    const div = document.createElement('div');
    div.setAttribute('id', 'row-'+ct++)
    div.setAttribute('class', 'training_container')

    const del = document.createElement('a');
    del.setAttribute('href','javascript:removeSavedTraining('.concat(de++,')'))
    del.setAttribute('class','remove_button')
    del.innerHTML='- Supprimer cette formation'
    

    form.appendChild(divi);
    divi.appendChild(div);
    div.appendChild(training_diploma);
    div.appendChild(training_school);
    div.appendChild(divSelect);
    divSelect.appendChild(training_level);
        training_level.appendChild(option1);
        training_level.appendChild(option2);
        training_level.appendChild(option3);
        training_level.appendChild(option4);
        training_level.appendChild(option5);
        training_level.appendChild(option6);
        training_level.appendChild(option7);
        training_level.appendChild(option8);
        training_level.appendChild(option9);
        training_level.appendChild(option10);                
    div.appendChild(training_start_date);
    div.appendChild(training_end_date);
    div.appendChild(del);
});
 return divi;
}

window.addEventListener("DOMContentLoaded", (event) => {
    document.getElementById("training").appendChild(createForm(<?php echo json_encode($training_array, JSON_PRETTY_PRINT) ?>));
});

函数createForm（arr）{
ct++；
de++；
na++；
const form=document.getElementById（“已形成”）；
const divi=document.getElementById（“bdd”）；
arr.forEach（元素=>{
const a=要素培训文凭；
const b=元素培训学校；
常数c=元素培训水平；
const d=元素培训开始日期；
const e=元素培训结束日期；
const training_文凭=document.createElement（“输入”）；
培训文凭设置属性（“值”，a）
培训文凭.setAttribute（'name'，'saved_training[''.concat（ct），][培训文凭]））
培训文凭要求=正确
const training_school=document.createElement（“输入”）；
培训学校。设置属性（'value'，b）
training_school.setAttribute（'name'，'saved_training[''.concat（ct，'][training_school]'））
培训学校要求=正确
const divSelect=document.createElement（'div'）；
divSelect.setAttribute（'class'，'select'）
const training_level=document.createElement（'select'）；
培训级别.设置属性（'value'，c）
培训级别.setAttribute（'id'，'rec\u mode'）
training_level.setAttribute（'name'，'saved_training[''.concat（ct，'][training_level]'））
培训水平要求=真实
const option1=document.createElement（'option'）；
option1.disabled=true
option1.innerHTML='--Type de diplôme--'；
const option2=document.createElement（'option'）；
选项2.innerHTML='Formation'
如果（option2.innerHTML==c）{
option2.selected=true
} 
const option3=document.createElement（'option'）；
选项3.innerHTML='Brevet'
如果（option3.innerHTML==c）{
option3.selected=true
} 
const option4=document.createElement（'option'）；
选项4.innerHTML='Bac'
如果（option4.innerHTML==c）{
选项4.selected=true
} 
const option5=document.createElement（'option'）；
选项5.innerHTML='Bac+1'
如果（option5.innerHTML==c）{
选项5.selected=true
} 
const option6=document.createElement（'option'）；
选项6.innerHTML='Bac+2'
如果（option6.innerHTML==c）{
选项6.selected=true
} 
const option7=document.createElement（'option'）；
选项7.innerHTML='Bac+3'
if（option7.innerHTML==c）{
选项7.selected=true
} 
const option8=document.createElement（'option'）；
选项8.innerHTML='Bac+4'
如果（option8.innerHTML==c）{
选项8.selected=true
} 
const option9=document.createElement（'option'）；
选项9.innerHTML='Bac+5'
如果（option9.innerHTML==c）{
选项9.selected=true
} 
const option10=document.createElement（'option'）；
选项10.innerHTML='Doctorat'
if（option10.innerHTML==c）{
选项10.selected=true
} 
const training_start_date=document.createElement（“输入”）；
培训开始日期。setAttribute（'type'，'month'）
培训开始日期setAttribute（'value'，d）
培训开始日期.setAttribute（'name'，'saved'u training['.concat（ct，'][training\u start\u date]'））
培训\开始\日期.required=true
const training_end_date=document.createElement（'input'）；
培训结束日期.setAttribute（'type'，'month'）
培训结束日期。setAttribute（'value'，e）
training_end_date.setAttribute（'name'，'saved_training[''.concat（ct，'][training_end_date]'））
培训\u结束\u日期.required=true
const div=document.createElement（'div'）；
div.setAttribute（'id'，'row-'+ct++）
div.setAttribute（'class'，'training_container'）
const del=document.createElement（'a'）；
del.setAttribute（'href'，'javascript:removeSavedTraining（'.concat（de++，'））
del.setAttribute（'class'，'remove_button'））
del.innerHTML='-supplimer-cette-formation'
表格.附属儿童(第i分部);；
第1分部附属儿童（分部）；
儿童部（培训文凭）；
儿童部（训练学校）；
div.appendChild（divSelect）；
divSelect.appendChild（培训级）；
培训水平。儿童（选项1）；
儿童培训（选项2）；
儿童培训水平（选项3）；
儿童培训水平（选项4）；
儿童培训水平（选项5）；
儿童培训水平（选项6）；
儿童培训水平（选项7）；
儿童培训水平（选项8）；
儿童培训水平（选项9）；
儿童培训水平（选项10）；
部门附件（培训开始日期）；
儿童分部（培训结束日期）；
儿童分部（del）；
});
返回divi；
}
addEventListener（“DOMContentLoaded”，（事件）=>{
document.getElementById（“training”）.appendChild（createForm（））；
});
function createForm(arr){

ct++;
de++;
na++;

const form = document.getElementById("formed");
const divi = document.getElementById("bdd");
arr.forEach(element => {   
    const a = element.training_diploma;
    const b = element.training_school;
    const c = element.training_level;
    const d = element.training_start_date;
    const e = element.training_end_date;

    const training_diploma = document.createElement('input');
    training_diploma.setAttribute('value', a)
    training_diploma.setAttribute('name','saved_training['.concat(ct,'][training_diploma]'))
    training_diploma.required = true

    const training_school = document.createElement('input');
    training_school.setAttribute('value', b)
    training_school.setAttribute('name','saved_training['.concat(ct,'][training_school]'))
    training_school.required = true

    const divSelect = document.createElement('div');
    divSelect.setAttribute('class', 'select')

    const training_level = document.createElement('select');
    training_level.setAttribute('value', c)
    training_level.setAttribute('id', 'rec_mode')
    training_level.setAttribute('name','saved_training['.concat(ct,'][training_level]'))
    training_level.required = true  

        const option1 = document.createElement('option');
        option1.disabled = true
        option1.innerHTML='-- Type de diplôme --';

        const option2 = document.createElement('option');
        option2.innerHTML='Formation' 
        if (option2.innerHTML == c) {
            option2.selected = true
        } 

        const option3 = document.createElement('option');
        option3.innerHTML='Brevet'
        if (option3.innerHTML == c) {
            option3.selected = true
        } 
        const option4 = document.createElement('option');
        option4.innerHTML='Bac'
        if (option4.innerHTML == c) {
            option4.selected = true
        } 
        const option5 = document.createElement('option');
        option5.innerHTML='Bac +1'
        if (option5.innerHTML == c) {
            option5.selected = true
        } 
        const option6 = document.createElement('option');
        option6.innerHTML='Bac +2'
        if (option6.innerHTML == c) {
            option6.selected = true
        } 
        const option7 = document.createElement('option');
        option7.innerHTML='Bac +3'
        if (option7.innerHTML == c) {
            option7.selected = true
        } 
        const option8 = document.createElement('option');
        option8.innerHTML='Bac +4'
        if (option8.innerHTML == c) {
            option8.selected = true
        } 
        const option9 = document.createElement('option');
        option9.innerHTML='Bac +5'
        if (option9.innerHTML == c) {
            option9.selected = true
        } 

        const option10 = document.createElement('option');
        option10.innerHTML='Doctorat'
        if (option10.innerHTML == c) {
            option10.selected = true
        } 

    const training_start_date = document.createElement('input');
    training_start_date.setAttribute('type', 'month')
    training_start_date.setAttribute('value', d)
    training_start_date.setAttribute('name','saved_training['.concat(ct,'][training_start_date]'))
    training_start_date.required = true

    const training_end_date = document.createElement('input');
    training_end_date.setAttribute('type', 'month')
    training_end_date.setAttribute('value', e)
    training_end_date.setAttribute('name','saved_training['.concat(ct,'][training_end_date]'))
    training_end_date.required = true

    const div = document.createElement('div');
    div.setAttribute('id', 'row-'+ct++)
    div.setAttribute('class', 'training_container')

    const del = document.createElement('a');
    del.setAttribute('href','javascript:removeSavedTraining('.concat(de++,')'))
    del.setAttribute('class','remove_button')
    del.innerHTML='- Supprimer cette formation'
    

    form.appendChild(divi);
    divi.appendChild(div);
    div.appendChild(training_diploma);
    div.appendChild(training_school);
    div.appendChild(divSelect);
    divSelect.appendChild(training_level);
        training_level.appendChild(option1);
        training_level.appendChild(option2);
        training_level.appendChild(option3);
        training_level.appendChild(option4);
        training_level.appendChild(option5);
        training_level.appendChild(option6);
        training_level.appendChild(option7);
        training_level.appendChild(option8);
        training_level.appendChild(option9);
        training_level.appendChild(option10);                
    div.appendChild(training_start_date);
    div.appendChild(training_end_date);
    div.appendChild(del);
});
 return divi;
}

window.addEventListener("DOMContentLoaded", (event) => {
    document.getElementById("training").appendChild(createForm(<?php echo json_encode($training_array, JSON_PRETTY_PRINT) ?>));
});