Как включить CSS в import.io Connect Extract

Используя коннектор import.io, я смог извлечь фрагмент html из исходного веб-сайта. Этот результат возвращается как тип "html". Результатом является единая таблица данных со стилями, определенными в HTML-коде тела, но не извлеченными. Это привело к тому, что извлеченный html-сегмент отображался без стиля и выглядел ужасно.

Есть ли способ ВКЛЮЧИТЬ извлечение стилей CSS, т.е. несколько CSS hrefs, включенных в исходный html, например

<link rel="stylesheet" href="http://cdn.ideamelt.com/1.3/css/ideamelt.min.css">

Также в то же время включить динамический css следующим образом:

<style type="text/css">
#financials-iframe-wrap {
    width: 635px
}
.td_genTable table {
    border: none
}
tr.net {
    font-weight: bold;
    border-top: 1px solid #009EC2
}
.td_genTable td {
    border: 0;
    padding: 0
}
a.h3-link {
    color: #ffffff;
    text-decoration: underline;
    float: right
}
</style>

... в извлечении соединителя, чтобы результирующий html-сегмент можно было правильно оформить и отобразить?

Заранее спасибо!


person wcfin    schedule 01.05.2015    source источник


Ответы (2)


Это довольно интересный вариант использования.

Вы можете извлечь ссылку и элементы стиля в формате html, используя собственный xpath, например //link и //style.

Затем вы можете вывести их в HTML-код своей страницы, и это будет импортировать документы css со страниц и должно включать стиль.

(Имейте в виду, что рассматриваемый веб-сайт может не захотеть, чтобы вы брали их css и использовали его на другом веб-сайте, поэтому они могут блокировать загрузку css на веб-сайты, размещенные в других доменах)

person Bam4d    schedule 13.05.2015

Извините, я не знаком с Import.io.
Есть ли способ получить ссылки из ссылок и контент из стилей? Используете ли вы javascript?
Если да, то вы можете использовать следующие функции js для включения ваших стилей в целевой документ:

// Include css from 'style' tag
function include_css (src) {
    var _head = document.head || document.getElementsByTagName('head')[0] || document.documentElement,
        style = document.createElement ('style');

    style.setAttribute ('type', 'text/css');
    if (style.styleSheet){
        style.styleSheet.cssText = src;
    } else {
        style.appendChild (document.createTextNode (src));
    }

    _head.appendChild (style);
}

// Include css referred by 'link' tag
function include_link (ref) {
    var _head = document.head || document.getElementsByTagName ('head')[0] || document.documentElement,
        style = document.createElement ('link');

    style.setAttribute ('rel',  'stylesheet');
    style.setAttribute ('type', 'text/css');
    style.setAttribute ('href', ref);
    _head.appendChild (style);
}
person al.scvorets    schedule 02.05.2015