JSFiddle - React, Tailwind, and code Playground

by jt3k

HTML

<base href="http://www.altegrosky.su/">
<p>erwrwer</p>

<link rel="stylesheet" href="http://www.altegrosky.su/css/style.css" />

        <h6>Прикрепленные файлы</h6>

<ol start="8888">
<li><a href="/lalalala.gif">lalalaa</a><p>Описание Я</p></li>
<li><a href="/lalalala.jpg" title="321Kb">lalalaa</a></li>
<li><a href="/lalalala.bmp" title="321Kb">lalalaa</a><p>Описание Я</p></li>
<li><a href="/lalalala.png" title="321Kb">lalalaa</a><p>Описание Я</p></li>
<li><a href="/lalalala.xls" title="321Kb">lalalaa</a><p>Описание Я</p></li>
<li><a href="/lalalala.xlsx" title="321Kb">lalalaa</a><p>Описание Я</p></li>
<li><a href="/lalalala.doc" title="321Kb">lalalaa</a><p>Описание Я</p></li>
<li><a href="/lalalala.docx" title="321Kb">lalalaa</a><p>Описание Я</p></li></ol>
        <h6>Прикрепленные файлы</h6>

<ol start=8888>
<li><a href="/lalalala.odf" title="321Kb">lalalaa</a><p>Описание Я</p></li>
<li><a href="/lalalala.odt" title="321Kb">lalalaa</a><p>Описание Я</p></li>
<li><a href="/lalalala.ott" title="321Kb">lalalaa</a><p>Описание Я</p></li>
<li><a href="/lalalala.ods" title="321Kb">lalalaa</a><p>Описание Я</p></li>
<li><a href="/lalalala.ots" title="321Kb">lalalaa</a><p>Описание Я</p></li>
<li><a href="/lalalala.doc" title="321Kb">lalalaa</a><p>Описание Я</p></li>
<li><a href="/lalalala.doc" title="321Kb">lalalaa</a><p>Описание Я</p></li>
<li><a href="/lalalala.doc" title="321Kb">lalalaa</a><p>Описание Я</p></li></ol>
        <h6>Прикрепленные файлы</h6>
        <ul class="doc">

            <li>
                <a class="button" href="#">
                    <span>
                        Скачать
                    </span>
                </a>
                <img src="../images/doc.gif" alt="">
                <p class="name">
                    <a href="#">
                        Технические характеристики Модем HN7000S</a> (172 Kb)</p>
                <p>Услуги связи по передаче данных, за исключением услуг связи по передаче данных для целей передачи голосовой...

JavaScript

$('ol[start=8888] > li').each(function() {

var link  = $('a',this).attr('href');
var atext = $('a',this).html();
var title = $('a',this).attr('title');
var opesa = $('p',this).html();
    if (opesa == null) { var opesa = ''; }
    if (title == undefined ) { var title = ''; }
    
    if (/\.(jpg|png|gif|bmp)$/.test(link) ) { var imgsrc = '/data/image/filetypes/image.png' }
    else if (/\.pdf$/.test(link) ) { var imgsrc = '/data/image/filetypes/pdf.png' }
    else if (/\.(docx|doc)$/.test(link) ) { var imgsrc = '/data/image/filetypes/doc.png' }
    else if (/\.(xlsx|xls)$/.test(link) ) { var imgsrc = '/data/image/filetypes/xls.png' }
    else { var imgsrc = '/data/image/filetypes/document.png'; }
    $(this).html('<a class="button" href="'+link+'"><span>Скачать</span></a><img src="'+imgsrc+'"><p class="name"><a href="'+link+'">'+atext+'</a> '+title+'</p><p>'+opesa+'</p>');

});
$('ol[start=8888]').addClass('doc');
//$('ol[start=8888]').replace('<ul class="doc">');