Форум

Jolly · #1 (**permalink**) 11.08.2018, 13:11

Здравствуйте.

Подскажите пожалуйста, как можно код html вставить в js.
Где можно найти статью, урок или может ко подскажет

.

Вот код:

<style>
	img {
    border: 0;
    max-width: 100%;
    }
	.cro-checkout-trustsection {
    background-color: white !important;
	border-radius: 5px;
	padding-top: 15px;
	border: 1px solid rgb(229, 229, 229);
    }
	.cro-checkout-payment-methods {
	width: 90%;
	margin: 15px auto;
    }
	.cro-checkout-trustsection-title {
    color: rgb(115, 115, 115);
	font-size: 14px;
	text-align: center;
    }
	</style>
	
<div class="cro-checkout-trustsection">
  <div class="cro-checkout-trustsection-title">Você pode pagar com:</div>
<div class="cro-checkout-payment-methods"><img class="cro-checkout-payment-methods-img" src="https://cdn.shopify.com/s/files/1/2569/8774/files/brazil-payment-methods-optimized.jpg?17084784513000531164"></div>
</div>

рони · #2 (**permalink**) 11.08.2018, 14:20

Jolly,
insertAdjacentHTML

Jolly · #3 (**permalink**) 11.08.2018, 15:50

Сообщение от рони

Jolly,
insertAdjacentHTML

Спасибо, но прочитав статью, я так и не поняла, как сделать мой вариант)

Jolly · #4 (**permalink**) 11.08.2018, 20:06

Начиталась всего и смогла сделать только так:

document.write('<div class="cro-checkout-trustsection-title">Você pode pagar com:</div>');
document.write('<div class="cro-checkout-payment-methods"><img class="cro-checkout-payment-methods-img" src="https://cdn.shopify.com/s/files/1/2569/8774/files/brazil-payment-methods-optimized.jpg?17084784513000531164"></div>');

А как это все обернуть в контейнер, чтобы добавить рамку?

рони · #5 (**permalink**) 11.08.2018, 20:20

Jolly,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
</head>

<body>

<script>
  var html = `<style>
	img {
    border: 0;
    max-width: 100%;
    }
	.cro-checkout-trustsection {
    background-color: white !important;
	border-radius: 5px;
	padding-top: 15px;
	border: 1px solid rgb(229, 229, 229);
    }
	.cro-checkout-payment-methods {
	width: 90%;
	margin: 15px auto;
    }
	.cro-checkout-trustsection-title {
    color: rgb(115, 115, 115);
	font-size: 14px;
	text-align: center;
    }
	</style>

<div class="cro-checkout-trustsection">
  <div class="cro-checkout-trustsection-title">Você pode pagar com:</div>
<div class="cro-checkout-payment-methods"><img class="cro-checkout-payment-methods-img" src="https://cdn.shopify.com/s/files/1/2569/8774/files/brazil-payment-methods-optimized.jpg?17084784513000531164"></div>
</div>`;
document.body.insertAdjacentHTML('beforeEnd', html)
</script>

</body>

</html>

Jolly · #6 (**permalink**) 11.08.2018, 20:43

Спасибо вам огромнейшее

Форум

Справочник

Discord чат

Курсы javascript