Я начинаю новый проект на работе, и нам было поручено создать универсальный заголовок.Это означает, что на разных принадлежащих нам доменах / серверах, наших клиентских сайтах и сторонних сайтах нам потребуется очень простой способ передачи этого кода людям.
Этот универсальный заголовок также будет содержать некоторый поискфункциональность, которая слегка относится к моему вопросу.Проще говоря, он будет содержать JavaScript для изменения атрибута action
в его элементе <form>
, в зависимости от выпадающего списка, а также отправки формы.
Способ, которым мы хотим, чтобы заголовок работал,что он живет в одном месте, мы думали о каком-то HTTP-запросе, чтобы получить заголовок.По нашему мнению, это максимизирует переносимость универсального заголовка.
Заголовок должен будет хорошо интегрироваться с WordPress (не проблема), но также и с AngularJS, в наших обсуждениях немного менее определенноэто будет возможно.Таким образом, «слегка релевантная» часть функции поиска.
Одним из решений, о которых мы говорили, было сделать это в HTML, как этот ответ , но я всегда был немного более пугливымо запросе необработанного HTML через HTTP и просто выгрузке его на страницу, но, возможно, это правильный путь, а может и нет?Так как мы не были уверены, мы подумали о JIRA Issue Collector , где они в основном транслируют JavaScript своему клиенту, который затем создает кнопку отслеживания проблем, закрепленную на боковой стороне страницы, имеющей некоторый HTML, CSS,и JS в этом.Затем пользователь может нажать эту кнопку, чтобы открыть форму, готовую для отправки.Это может быть чрезмерным упрощением, но в основном их фрагмент JS упаковывает HTML / CSS / JS и отправляет данные на их сервер.
В этом направлении мы хотели бы пойти с этим: наличие одного файла, содержащего всенам нужно.Однако мне интересно несколько вещей:
- Какие есть шаблоны для работы со "флэш" заголовка? Так как он AJAXed при загрузке страницы, заголовок будетпропустить, вдруг оказаться там, как вы можете справиться с этой проблемой юзабилити?Я думал как область Скелета, где должен быть заголовок, затем заменим его на JavaScript, но я не знаю, банально это или нет.
- Какой стандартный способ связать создание HTML, CSS и некоторых функций JavaScript, содержащихся внутри одного файла (например, файла JS), или лучше иметь файл HTML, связанный с JS и таблицей стилей? Я просто не уверено комплектации.Мы не будем использовать Angular или React для этого проекта, но у меня есть кое-какое знакомство с Webpack, которое, похоже, может сработать.Даже если этот проект не будет использовать Angular или React, ему все равно потребуется интеграция с другими фреймворками.
- Одна вещь, о которой я думаю, - это возможность разбить HTML-код на отдельный HTTP-запрос и получитьJavaScript и стили объединены в другом HTTP-запросе - почти как веб-компонент.Другими словами, мы можем запросить HTML и CSS / JS параллельно, а когда он вернется, просто разбить его вместе в пользовательском интерфейсе. О чем опасно это делать, или о каких вещах нужно думать, когда вы делаете это таким образом?
- Что было бы хорошим способом интегрировать это с AngularJS? Поскольку этот заголовок будет содержать функции поиска, нам нужен какой-то способ трансляции (на AngularJS), когда кто-то отправляет запрос, и что это за запрос, который он отправил.
Первоначально для последнегоВыше я думал о том, чтобы прикрепить его к window
объекту.Затем создайте пользовательский обработчик событий в JavaScript - но как вы это сделаете?Может быть, приведенный ниже псевдокод не совсем понятен, но именно поэтому я задаю вопрос:
/// inside the SearchController in AngularJS
$scope.defaultRealm = 'products';
/// to select default realm
document.when('angularJSLoads', function () {
document.getElementById('universial-header').find('.dropdown', function () {
// put actions to select $scope.defaultRealm in the dropdown options.
})
})
/// to search in own defaultRealm
document.querySelector('.dropdown').onEvent('headerSearch', function (e) {
e.preventDefault();
var data = event.target.value;
// do searching in AngularJS
})
Если есть какие-то лучшие, более чистые способы, я был бы рад услышать об этом.
Я ценю любую помощь в этом.Для нас это новая территория, и в целом мы хотим иметь легко обслуживаемый заголовок, который можно легко использовать для разных доменов и т. Д.