- PVSM.RU - https://www.pvsm.ru -
Вы наверняка привыкли, что для того, чтобы подключить внешний JavaScript код на вашей HTML-страничке, нужно писать длинные конструкции вроде этой:
<script src="JS/example.js"></script>
Много времени я мирился этой конструкцией, но однажды мне стало лень писать её, потому что понял, что мне вполне по силам сократить её до такой:
@j JS/example
И для того, чтобы эта штука ожила и подключила к HTML example.js, я реализовал библиотеку Includor.js.
Чтобы подключить мою библиотеку, скопируйте этот код и вставьте в свой HTML:
<script src="http://raw.githubusercontent.com/malyutinegor/malyutinegor.github.io/master/libs/includor/includor.min.js"></script>
А потом этот:
@gj malyutinegor: malyutinegor.github.io master/libs/includor/hello.js
Чтобы начать интерпретацию, необходимо выполнить этот JavaScript-код:
I.start();
При выполнении этого кода все конструкции библиотеки вроде @j examaple, @c hello и т.д. автоматически исчезнут из HTML-кода, и, соответственно, со страницы.
Если всё прошло успешно, то у вас в консоли [1] должны появиться два сообщения: «Includor.js is ready for use!» и «Hello, Includor.js!»
Если вы хотите сразу скопировать код, копируйте или тут [2] скачайте:
<html>
<head>
<title>Includor.js tests</title>
<meta charset="utf-8">
</head>
<body>
<!-- Includes -->
@gj malyutinegor: malyutinegor.github.io master/libs/includor/hello
<!-- Scripts -->
<script src="http://raw.githubusercontent.com/malyutinegor/malyutinegor.github.io/master/libs/includor/includor.min.js"></script>
<script>
I.start()
</script>
</body>
</html>
Чтобы подключить файл JavaScript, надо написать команду в HTML, которую вы уже видели выше:
@j путь/до/вашего/js/безрасширения
Похожая команда нужна, чтобы подключить CSS:
@c путь/доВашего/css/без/расширения
Можно также легко загрузить JS и CSS с Github:
@gj имя_пользователя: репозиторий_пользователя веткаРепозитория/путь/до/вашего/js/без/расширения
@gс имя_пользователя: репозиторий_пользователя ветка_репозитория/путьДо/вашего/css/без/расширения
Также библиотека Includor.js добавляет в JavaScript 2 полезные функции:
Промежутки между словами в конструкции могут любой длины, поэтому сработает даже такой код:
@gj githubuser :hello html/JS/example
Моя библиотека позволяет легко подключать JavaScript-код и CSS-таблицы. Очень надеюсь, что она кому-то поможет.
Спасибо за внимание!
P.S.: исходный код библиотеки и минифицированную версию можно скачать на Гитхабе [3].
Автор: GLaDosSystem
Источник [4]
Сайт-источник PVSM.RU: https://www.pvsm.ru
Путь до страницы источника: https://www.pvsm.ru/javascript/208772
Ссылки в тексте:
[1] консоли: http://learn.javascript.ru/devtools
[2] тут: https://cloud.mail.ru/public/2KT5/nBzoJspCk
[3] скачать на Гитхабе: https://github.com/malyutinegor/malyutinegor.github.io/tree/master/libs/includor/
[4] Источник: https://habrahabr.ru/post/315024/?utm_source=habrahabr&utm_medium=rss&utm_campaign=sandbox
Нажмите здесь для печати.