Как определить тип файла с помощью Jquery
Разберем на примере. Есть вот примерно такая HTML конструкция
<p>Пожалуйста, ознакомьтесь с <a href="/files/lenobl_delivery.pdf">тарифами</a>.</p>Задача: надо определить тип файла с JQuery в ссылке, и подставить иконку, что бы визуально было понятно, что это за ссылка.
Используем для этого актуальную версию JQuery. Код довольно простой. Логика такова: перебираем все ссылки в блоке, и вставляем строчный элемент <i class="b_icons"></i> с необоходимым классом перед ссылкой.
$('.b_article-full a').each(function () {
if (/.*\.pdf/.test($(this).attr('href'))) {
$(this).before('<i class="b_icons pdf"></i> ');
}
if (/.*\.zip/.test($(this).attr('href'))) {
$(this).before('<i class="b_icons zip"></i> ');
}
if (/.*\.doc/.test($(this).attr('href'))) {
$(this).before('<i class="b_icons doc"></i> ');
}
if (/.*\.docx/.test($(this).attr('href'))) {
$(this).before('<i class="b_icons doc"></i> ');
}
});Далее немного чудо SCSS кода:
.b_icons {
display : inline-block;
width : 16px;
height : 16px;
position : relative;
top : 3px;
&.pdf {
background : url(путь к иконке)
}
&.doc {
background : url(путь к иконке)
}
&.zip {
background : url(путь к иконке)
}
}
Вот так просто можно определить тип файла с JQuery в документе.
