Главная » Интересно

Примеры вывода функции JavaScript на экран — код и описание

На чтение 3 мин Опубликовано Обновлено

JavaScript – один из самых популярных языков программирования, который широко используется для создания интерактивных веб-приложений. В этой статье мы рассмотрим несколько примеров, как вывести результат выполнения функции JavaScript на экран.

Для начала рассмотрим простейший пример. Допустим, у нас есть функция, которая сложит два числа и вернет результат:

function sum(a, b) {
return a + b;
}

Чтобы вывести результат выполнения этой функции на экран, мы можем воспользоваться методом document.write. Для этого добавим следующий код после объявления функции:

document.write(sum(2, 3));

Теперь, если запустить этот код в браузере, мы увидим на экране число 5.

console.log(sum(2, 3));

При запуске этого кода в консоли мы увидим результат выполнения функции – число 5.

ПримерОписание

function showMessage() {
document.getElementById("output").innerHTML = "Привет, мир!";
}
showMessage();

В этом примере мы объявляем функцию showMessage, которая устанавливает содержимое элемента с идентификатором "output" равным строке "Привет, мир!". Затем мы вызываем функцию showMessage, чтобы вывести сообщение на страницу.


function calculateSum(a, b) {
var sum = a + b;
return sum;
}
var result = calculateSum(5, 7);
document.getElementById("output").innerHTML = "Сумма чисел равна: " + result;

alert('Привет, мир!');
let a = 1;
let b = 2;
let sum = a + b;
alert('Сумма чисел ' + a + ' и ' + b + ' равна ' + sum);

Для использования console.log просто добавьте его внутри функции, передавая нужную информацию в виде параметров. Например:

function greet(name) {
console.log("Привет, " + name + "! Добро пожаловать на наш сайт.");
}
greet("Иван");

Метод innerHTML позволяет вывести результат выполнения функции JavaScript непосредственно на страницу HTML. Этот метод используется для изменения содержимого элемента HTML с помощью JavaScript.

<p id="result"></p> var resultElement = document.getElementById("result");

Или:

var resultElement = document.querySelector("#result");

Затем можно вызвать функцию и присвоить результат вызова функции переменной:

var result = myFunction();

Наконец, результат функции можно вывести на экран с помощью свойства innerHTML элемента:

resultElement.innerHTML = result;

Таким образом, функция будет выполнена и ее результат будет выведен на экран в заданном элементе:

<p id="result">Результат функции</p>

Каждый раз при вызове функции ее результат будет обновляться на странице, так как свойство innerHTML изменяется и соответствует новому значению.

Обратите внимание, что использование свойства innerHTML может представлять потенциальную угрозу безопасности, так как содержимое элемента может быть изменено без проверки или фильтрации данных.


<script>
function sayHello() {
document.write("Привет, мир!");
}
sayHello();
</script>

В результате выполнения этого кода на веб-странице будет выведена фраза "Привет, мир!" - это результат работы функции sayHello().

Однако следует заметить, что применение document.write() может быть неудобным, особенно при работе с большим количеством кода. Он требует внимательного контроля, чтобы избежать случайных перезаписей.

Оцените статью