Jakieś sugestie dotyczące biblioteki szablonów HTML, która będzie dobrze współpracować z JQuery? Googlowanie pojawia się w wielu bibliotekach, ale nie jestem pewien, czy istnieje dobrze rozpoznawalna biblioteka, która przetrwałaby próbę czasu.
Jakieś sugestie dotyczące biblioteki szablonów HTML, która będzie dobrze współpracować z JQuery? Googlowanie pojawia się w wielu bibliotekach, ale nie jestem pewien, czy istnieje dobrze rozpoznawalna biblioteka, która przetrwałaby próbę czasu.
Odpowiedzi:
Cóż, szczerze mówiąc, tworzenie szablonów po stronie klienta jest obecnie bardzo popularne, ale niezła dżungla.
najbardziej popularne są, jak sądzę,:
jest wiele innych, ale musisz je przetestować, aby zobaczyć, co najbardziej Ci odpowiada i odpowiada Twojemu stylowi projektu.
Osobiście mam problem z dodaniem nowej składni i zestawu logiki ( mieszanie logiki i szablonu, cześć ?? ) i przeszedłem na czysty js. Każdy z moich szablonów jest przechowywany we własnym pliku html (./usersTable.row.html). Używam szablonów tylko podczas AJAX-u treści i mam kilka plików js "logiki", jeden dla tabel, jeden dla div, jeden dla list. ani nawet jednego dla opcji select (gdzie używam innej metody).
Za każdym razem, gdy próbowałem zrobić coś bardziej złożonego, stwierdzałem, że kod jest mniej przejrzysty i stabilizacja zajmuje mi więcej czasu niż robienie tego w „stary” sposób. Logika w szablonie jest moim zdaniem kompletnym bezsensem, a dodanie własnej składni dodaje tylko bardzo trudne do śledzenia błędy.
silnik szablonów dla JavaScript.
Wtyczka do jQuery ...
Cechy:
- 100% w JavaScript
- prekompilator
- Obsługa formatu JSON
- Pracuj z Ajaxem
- Zezwalaj na użycie kodu JavaScript w szablonie
- Pozwól budować kaskadowe szablony
- Pozwól definiować parametry w szablonach
- Odśwież na żywo! - automatyczna aktualizacja treści z serwera ...
Istnieje uzasadnione dokument dyskusja na ten temat tutaj , która obejmuje szereg narzędzi szablonów. Nie jest to jednak specyficzne dla jQuery.
Wtyczka jQuery Templates stworzona przez Microsoft i zaakceptowana jako oficjalna wtyczka jQuery.
Ale pamiętaj , że jest teraz przestarzały.
Chciałbym sprawdzić json2html , rezygnuje z pisania fragmentów kodu HTML i zamiast tego polega na transformacjach JSON, aby przekonwertować tablice obiektów JSON na listy nieustrukturyzowane. Bardzo szybki i wykorzystuje tworzenie DOM.
Kilka lat temu zbudowałem IBDOM: http://ibdom.sf.net/ | Od grudnia 2009 obsługuje wiązanie jQuery, jeśli otrzymujesz je bezpośrednio z pnia.
$("#foo").injectWith(collectionOfJavaScriptObjects);
lub
$("#foo").injectWith(simpleJavaScriptObject);
Ponadto możesz teraz umieścić wszystkie znaczniki „data: propName” w atrybutach class = „data: propName inne nazwy klas”, dzięki czemu nie musisz zaśmiecać zawartości aplikacji tymi znacznikami.
Nie zaktualizowałem jeszcze części dokumentacji, aby odzwierciedlić moje ostatnie ulepszenia, ale mam różne wersje tego frameworka w produkcji od 2007 roku.
Do sceptyków tego pytania:
Kiedy Microsoft wynalazł w IE5 coś, co teraz znamy jako XmlHttpRequest i wzorzec „ajax”, częścią tego obietnicy była czysta wymiana danych między przeglądarką internetową a serwerem. Te dane miały zostać zawarte w XML, ponieważ w latach 1999/2000 XML był po prostu bardzo gorący. Poza pobieraniem dokumentu xml przez sieć z mechanizmem oddzwaniania, komponent MSXML ActiveX MS obsługiwał również wstępną implementację tego, co teraz znamy jako XSL-T i XPath.
Połączenie pobierania HTTP / XML, XPath i XSL-T dało programistom ogromną kreatywność w tworzeniu bogatych „dokumentów”, które zachowywały się jak „aplikacje”, wyłącznie wysyłając i, co ważniejsze, pobierając dane z serwera.
Dlaczego jest to przydatny wzór? To zależy od tego, jak skomplikowany jest twój interfejs użytkownika i jak bardzo zależy Ci na jego utrzymaniu.
Podczas budowania wizualnie bardzo bogatego, semantycznie zaznaczonego interfejsu z zaawansowanym CSS, ostatnią rzeczą, którą chcesz zrobić, jest podzielenie fragmentów znaczników na „mini-kontroler / widoki”, aby móc .innerHTML fragment dokumentu do głównego dokument, a oto dlaczego.
Jedną z kluczowych zasad pozwalających na zarządzanie zaawansowanym interfejsem użytkownika html / css jest zachowanie jego walidacji przynajmniej w aktywnej fazie rozwoju. Jeśli twoje znaczniki się sprawdzą, możesz skupić się na błędach CSS. Teraz, jeśli fragmenty znaczników zostaną wstrzyknięte na różnych etapach interakcji z użytkownikiem, zarządzanie wszystkim stanie się bardzo nieporęczne, a całość stanie się krucha.
Pomysł polegał na tym, aby wszystkie konstrukcje UI ze znacznikami były w jednym dokumencie, pobierały TYLKO DANE przez sieć i używały solidnej struktury, która przynajmniej po prostu wstrzyknie dane do konstrukcji znaczników i co najmniej replikuje konstrukcje znaczników które oznaczyłeś jako powtarzalne.
Było to możliwe dzięki XSL-T i XPath w IE5 +, ale praktycznie żadnych innych przeglądarek. Niektóre frameworki przeglądarek F / OSS parały się z XPath, ale nie jest to coś, na czym jeszcze możemy polegać.
Więc jaka jest następna najlepsza rzecz do osiągnięcia takiego wzoru? IBDOM. Pobierz dane z serwera i umieść je w dokumencie. bez wysiłku.
Powinieneś rzucić okiem na szablony Javascript, jest to mały silnik szablonów używany w słynnej wtyczce jQuery File Upload i opracowany przez tego samego autora, Sebastiana Tschana (@blueimp)
https://github.com/blueimp/JavaScript-Templates
Postępuj zgodnie z instrukcją użytkowania opracowaną przez Sebastiana, po prostu usuń tę linię
document.getElementById("result").innerHTML = tmpl("tmpl-demo", data);
Zastąp go tym
$('#result').html(tmpl('tmpl-demo', data));
Nie zapomnij dodać znacznika wynikowego div również do pliku HTML
<div id="result"></div>
Cieszyć się