У меня есть это на странице HTML. Это внешний скрипт, который должен добавить div к canvasDiv.

Сценарий работает, если я добавляю div в теле. Но если я хочу, чтобы он добавлялся в div, который я добавил через функцию, она, похоже, не работает. Где я не прав?

function AdDiv(divname)
    {
        alert("loaded");
        alert(divname);

        //make a div that will be used for the canvas
        var iDiv = document.createElement('div');
        iDiv.id = 'placedCanvas';
        iDiv.className = 'placedCanvas';

        //document.getElementsByTagName('body')[0].appendChild(iDiv);
        document.getElementsByTagName(divname).appendChild(iDiv);
    }
    <div id="canvasDiv"></div>

    <script type="text/javascript" src="https://pixelvaria.com/wp-content/themes/pixelvaria/js/modelscript.js"></script>
    <script>
       AdDiv("canvasDiv");
    </script>

    
0
Ben Aerens 20 Авг 2018 в 21:21

3 ответа

Лучший ответ

Вы вызываете неправильный метод Javascript. Вы хотите getElementById (поскольку именно это вы передаете getElementsByTagName:

function AdDiv(divname)
    {
        alert("loaded");
        alert(divname);

        //make a div that will be used for the canvas
        var iDiv = document.createElement('div');
        iDiv.id = 'placedCanvas';
        iDiv.className = 'placedCanvas';

        //document.getElementsByTagName('body')[0].appendChild(iDiv);
        document.getElementsById(divname).appendChild(iDiv);
    }
    <div id="canvasDiv"></div>

    <script type="text/javascript" src="https://pixelvaria.com/wp-content/themes/pixelvaria/js/modelscript.js"></script>
    <script>
       AdDiv("canvasDiv");
    </script>

    
0
hev1 20 Авг 2018 в 18:54

Вы должны использовать document.getElementById, чтобы получить Элемент его id. document.getElementsByTagName (как следует из названия ) возвращает HTMLCollection элементов, имеющих конкретное имя.

<div id="canvasDiv"></div>

    <script type="text/javascript" src="https://pixelvaria.com/wp-content/themes/pixelvaria/js/modelscript.js"></script>
<script>
function AdDiv(divname)
{
        alert("loaded");
        alert(divname);

        //make a div that will be used for the canvas
        var iDiv = document.createElement('div');
        iDiv.id = 'placedCanvas';
        iDiv.className = 'placedCanvas';
        iDiv.textContent = "Div text";

        //document.getElementsByTagName('body')[0].appendChild(iDiv);
        document.getElementById(divname).appendChild(iDiv);
}
AdDiv("canvasDiv");
</script>
0
hev1 20 Авг 2018 в 18:50

Использовать это:

function AdDiv(divId)
{

    //make a div that will be used for the canvas
    var iDiv = document.createElement('div');
    iDiv.id = 'placedCanvas';
    iDiv.classList.add('placedCanvas');

    //append it to the div with the given ID, not name
    document.getElementById(divId).appendChild(iDiv);
}

С этим:

<div id="canvasDiv"></div>

<script type="text/javascript" src="https://pixelvaria.com/wp-content/themes/pixelvaria/js/modelscript.js"></script>
<script>
   window.onload = function () 
   {
       AdDiv("canvasDiv");
   }
</script>
0
Sacha 20 Авг 2018 в 18:34
51936516