Мне нужно создать виджет, который может быть встроен в другие веб-сайты (очень похоже на полосу, мнение и т. Д.)
Я понимаю основные понятия, которые мне понадобятся для создания js, на который будут ссылаться на целевой странице, и одного или нескольких компонентов пользовательского интерфейса, которые будут инициировать взаимодействие.
Мой конкретный вопрос: как мне убедиться, что внешний вид диалогового окна pop соответствует моему бренду (в идеале через css), не влияя на исходный сайт? Есть ли учебник по реагированию для достижения этого.
Sample HTML site:
<html>
<script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
<script src="https://example.com/widgets/widget.js"></script>
<head></head>
<body>
<button id="btnShowWidget">show widget</button>
<div id="divWidget"></div>
</body>
</html>
widget.js
$(document).ready(function() {
console.log("in widget.js, document ready!");
$("#btnShowWidget").click(showWidget);
});
function showWidget() {
$.ajax({
url: "https://api.example.com/data"
}).then(function(data) {
console.log(data);
//Render the div
});
}