Question

This is my first time using Stack Overflow, so if I’ve done something wrong let me know.

I am currently trying to write a “scraper”, for lack of better term, that will extract html and replace certain inline CSS styles with the HTML counterparts. For example, I have this HTML:

<p style="text-align:center"><span style="font-weight:bold;font-style:italic;">Some random text here. What's here doesn't matter so much as what needs to happen around it.</span></p>

I want to be able to replace font-weight:bold with <b>, font-style:italic with <i>, text-align:center with <center>. Afterwards, I’ll be using regex to remove all non-basic HTML tags, and any attributes. KISS definitely applies here.

I have read this question: Convert CSS Style Attributes to HTML Attributes using Perl and a few others regarding the use of HTML::TreeBuilder and other modules (like HTML::TokeParser) but so far I’ve stumbled all over myself.

I’m new to Perl, but not new to coding in general. The logic of it is the same.

Here’s what I have so far:

#!/usr/bin/perl
use warnings;
use strict;

use HTML::TreeBuilder;

my $newcont = ""; #Has to be set to something? I've seen other scripts where it doesn't...this is confusing.
my $html = <<HTML;
<p style="text-align:center"><span style="font-weight:bold;font-style:italic;">Some random text here. What's here doesn't matter so much as what needs to happen around it.</span> And sometimes not all the text is styled the same.</p>
HTML

my $tb = HTML::TreeBuilder->new_from_content($html);
my @spans = $tb->look_down(_tag => q{span}) or die qq{look_down for tag failed: $!\n};

for my $span (@spans){
    #What next?? A print gives HASH, not really workable. Split doesn't seem to work...I've never felt like such a noobie coder before.
}

print $tb->as_HTML;

Hopefully someone can help me out, show me what I may have done wrong, etc. I’m genuinely curious as to what other possible ways there are to do this. Or if it’s ever been done before.

Also, if someone could help by suggesting which tags I should have used, that would be great. The only one I know for sure to use is perl.

Answer 1

By using HTML::TreeBuilder you are definitely on the right track; for parsing CSS, I’ve just found CSS::DOM. It is a really interesting module, which allows you to access properties with little effort.

#!/usr/bin/perl
use warnings;
use strict;

use HTML::TreeBuilder;
use CSS::DOM::Style;

my $html = <<HTML;
<p style="text-align:center"><span style="font-weight:bold;font-style:italic;">Some random text here. What's here doesn't matter so much as what needs to ha>
HTML

my $tb = HTML::TreeBuilder->new_from_content($html);


my @replacements = (
    { property => 'font-style', value => 'italic', replacement => 'em' },
    { property => 'font-weight', value => 'bold', replacement => 'strong' },
    { property => 'text-align', value => 'center', replacement => 'center' },
);

# build a sensible list of tag names (or just use sub { 1 })
my @nodes = $tb->look_down(sub { $_[0]->tag =~ /^(p|span)$/ });

for my $el (@nodes) {
    if ($el->attr('style')) {
        my $st = CSS::DOM::Style::parse($el->attr('style'));
        if ($st) {
            foreach my $h (@replacements) {
                if ($st->getPropertyValue($h->{property}) eq $h->{value}) {
                    $st->removeProperty($h->{property});
                    my $new = HTML::Element->new($h->{replacement});
                    foreach my $inner ($el->detach_content) {
                        $new->push_content($inner);
                    }
                    $el->push_content($new);
                }
            }
            $el->attr('style', $st->cssText ? $st->cssText : undef);
        }
    }
}

print $tb->as_HTML(undef, "\t");