Изменить фоновое изображение сайта с помощью JavaScript

Нельзя изменять фоновое изображение других сайтов с помощью JavaScript. Это нарушает политику безопасности браузера и может привести к утечке данных пользователей. Вы можете изменять фоновое изображение только своего собственного сайта или сайта, для которого у вас есть разрешение на внесение изменений.

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

HTML:

<!DOCTYPE html>
<html>
<head>
	<title>Изменить фоновое изображение</title>
	<meta charset='utf-8'>
	<meta name='viewport' content='width=device-width, initial-scale=1'>
	<link rel='stylesheet' type='text/css' href='style.css'>
</head>
<body>
	<div class='container'>
		<h1>Изменить фоновое изображение</h1>
		<input type='text' id='url' placeholder='Введите URL изображения'>
		<button id='apply'>Применить</button>
	</div>

	<script src='script.js'></script>
</body>
</html>

CSS:

body {
	background-image: url('');
	background-repeat: no-repeat;
	background-size: cover;
}

.container {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-top: 50px;
}

h1 {
	font-size: 36px;
	margin-bottom: 30px;
}

input {
	padding: 10px;
	margin-bottom: 20px;
	border: 2px solid #ccc;
	border-radius: 5px;
	width: 400px;
}

button {
	padding: 10px 20px;
	background-color: #007bff;
	color: #fff;
	border: none;
	border-radius: 5px;
	cursor: pointer;
	transition: background-color 0.3s ease;
}

button:hover {
	background-color: #0069d9;
}

JavaScript:

function changeBackground(url) {
	document.body.style.backgroundImage = 'url('' + url + '')';
}

document.getElementById('apply').addEventListener('click', function() {
	var url = document.getElementById('url').value;
	changeBackground(url);
});

Этот код позволяет вам ввести URL-адрес изображения в текстовое поле и применить его в качестве фонового изображения вашего сайта. Обратите внимание, что для работы кода вы должны разместить JavaScript-код в файле script.js и связать его с вашим HTML-файлом.

Изменить фоновое изображение сайта с помощью JavaScript