Передача переменных как параметров из одной функции в несколько функций

Question

В моем скрипте у меня есть функция createEl(), где я объявляю 2 переменные и вызываю 2 других функции, передающих эти объявленные переменные этим двум функциям.

Нажав на одну ссылку, первая функция должна добавить 10px к высоте divp. Нажав на другую ссылку, вторая функция должна вычесть 10px с высоты div.

Это не работает должным образом. Я считаю, что я должен назвать эти 2 функции из моих первых функций каким-то другим способом? Теперь результат состоит в том, что любая ссылка, которую я нажимаю на эти 10px, всегда вычитается. Пожалуйста помоги.

P.S. Я ищу вариант без глобальных переменных, а просто передаю переменные как параметры от одной функции до нескольких функций.

HTML:

<a href="" onclick="createEl();return false;">Larger</a>&nbsp;&nbsp; 
<a href="" onclick="createEl();return false;">Smaller</a> 

<div id='box'></div> 

JavaScript:

function createEl() { 
    var x = document.getElementById('box'); 
    var h = x.offsetHeight; 

    large(x,h); 
    small(x,h); 
} 

function large(x,h) { 
    x.style.height = h + 10 + "px"; 
} 

function small(x,h) { 
    x.style.height = h - 10 + "px"; 
} 

Answer 1

Обновите HTML для отправки параметра идентификатор для вызова функции.

<a href="" onclick="createEl('large');return false;">Larger</a>&nbsp;&nbsp; 
<a href="" onclick="createEl('small');return false;">Smaller</a> 
<div id='box'></div> 

JavaScript:

function createEl(funcName){ 

     var x = document.getElementById('box'); 
     var h = x.offsetHeight; 

     if(funcName =="large") large(x,h); //depending on the parameter call the required function 
     else small(x,h); 
} 

Answer 2

Вы можете передать смещение в качестве параметра, и создать общий changeHeight(offset) функцию.

Соответствие вашим требованиям?

HTML:

<a href="" onclick="changeHeight(10);return false;">Larger</a>&nbsp;&nbsp; 
<a href="" onclick="changeHeight(-10);return false;">Smaller</a> 
<div id='box'></div> 

JavaScript:

changeHeight(offset) { 
    var x = document.getElementById('box'); 
    x.style.height = (x.offsetHeight + offset) + "px"; 
}