Mam dynamicznie dodając znaczniki CSS do strony z jQuery:Czy jest coś takiego jak mapy źródłowe dla CSS?
$('<style type="text/css"/>').text(css).appendTo(document.head);
Patrząc w Chrome Developer Tools, wszystkie CSS pojawia się jako „localhost”, które nie zawsze jest pomocne:
Czy jest coś takiego jak Mapy źródłowe dla CSS, które pozwolą mi zidentyfikować źródło CSS do debuggera?
Dodaj sourceURL do wstawianego znacznika stylu podczas dodawania go.
/*@ sourceURL=mystyles.css */
Dzięki temu ta wbudowana etykieta będzie tymczasową nazwą używaną w DevTools do nawigacji.
Czy ma to działać z wbudowanymi mapami źródłowymi? Na przykład. ' ' –
Identyfikuje źródło CSS. Wyświetla się tylko jako localhost, ponieważ źródłem stylu jest wewnętrzny javascript na stronie głównej localhost. jeśli klikniesz na link do lokalizacji reguły, to powinno ci to zabrać do wbudowanego javascriptu, który dynamicznie ustawi twój styl.
Jeśli chodzi o mapę źródłową, czy próbowałeś rozszerzyć sekcję "Obliczony styl", a następnie rozwinąć określony styl, w którym chcesz wyświetlić hierarchię dziedziczenia?
Po prostu ciekawy i nie mający znaczenia, aby wyjaśnić cały projekt, ale dlaczego w ten sposób dodajesz arkusze stylów? Dodanie arkuszy stylów warunkowo przed udostępnieniem szablonów z pewnością rozwiąże ten problem, a także spowoduje znacznie mniej ponownego wykonywania pracy wymaganej przez przeglądarkę, gdy dynamiczny CSS, taki jak ten, zostanie wstrzyknięty ... – joeellis
Chrome wykonuje dobrą robotę polegającą na identyfikowaniu zdalnego, strony i poziom CSS na poziomie elementu. localhost jest po prostu twoją domyślną stroną i prawdopodobnie właściwym źródłem twojego dynamicznie dodawanego CSS. Jestem z @joeellis jednak nie podoba mi się pomysł tworzenia CSS w locie. Powinien zostać dodany do strumienia odpowiedzi tak wcześnie, jak to możliwe, aby przeglądarka mogła go użyć do renderowania później, zamiast ciągle wyświetlać elementy na podstawie dynamicznie dodawanych zmian. – iGanja
@joeellis Jest to system wtyczek dla większego szkieletu. Wtyczki mogą np. Dodawać CSS i JavaScript do strony, która zostanie oceniona po zainicjowaniu głównej aplikacji, ale zanim zacznie swoją główną pętlę. Dziwny kod kleju wymaga dziwacznych rozwiązań klejenia :) –