JavaScript - код не работает - передача аргумента в функцию

Question

Я пытаюсь понять приложение закладок, которое я нашел в интернете, вот ссылка для кода https://github.com/bradtraversy/bookmarker/blob/master/js/main.js Теперь в этом коде в строке 85 он строит button элемент с onclick событие, назначьте его функции deleteBookmark() и передал аргумент url в этом, который затем получают в deleteBookmark() функция в строке 55, и его код работает, но когда я попытался создать подобный код, чтобы лучше понять, что происходит в этом приложении, мой код не работает. Я использую код ниже.

    <div id="divArgument"></div>
    <input type="text" id="argument">
    <p id="displayArg"></p>
    <script>
    var testArg = document.getElementById('divArgument');
    var getVal = document.getElementById('argument').value;
    testArg.innerHTML = '<button onclick="sendArg(\''+getVal+'\')">Display Argument</button>';

    function sendArg(recVal){
            document.getElementById('displayArg').innerHTML = recVal;
        } 
    </script>

Answer 1

Когда '<button onclick="sendArg(\''+getVal+'\')">.... выполняется getVal не имеет никакого значения.

Так ставь var getVal = document.getElementById('argument').value; внутри функции обработчика событий

var testArg = document.getElementById('divArgument');
testArg.innerHTML = '<button onclick="sendArg()">Display Argument</button>';

function sendArg(recVal) {
var getVal = document.getElementById('argument').value;
  document.getElementById('displayArg').innerHTML = getVal;
}

DEMO