Replace only raw text in HTML string - html

I have a string:
html_string =
'<span><span class=\"ip\"></span> Do not stare <span class=\"img\"></span> at the monitor continuously </span>\r\n'
I want to replace the character s in the raw text (not in the html tags) of html_string with <span class="highlighted">s</span>.
The result should be:
'<span><span class=\"ip\"></span> Do not <span class="highlighted">s</span>tare <span class=\"img\"></span> at the monitor continuou<span class="highlighted">s</span>ly </span>\r\n'
What I did is:
html_string.gsub(/s/, '<span class="highlighted">s</span>')
but this replaces all occurrences of the s character regardless of raw text or a tag. I want to replace it skipping html tags and its attributes. How it can be done?

Do not pretend to be ideal answer, just to give you a way where to go:
require 'nokogiri'
html_string = '<span><span class="ip"></span> Do not stare <span class="img"></span> at the monitor continuously </span>'
doc = Nokogiri::HTML.fragment(html_string)
spans = doc.css('span')
spans.each do |span|
span.xpath('text()').each do |text|
if text.content =~ /stare/
text.content = text.content.sub(/stare/, '<span class="highlighted">s</span>tare')
end
end
end
p doc.to_html.gsub(/\</, '<').gsub(/\>/, '>')
Which output is:
#=> "<span><span class=\"ip\"></span> Do not <span class=\"highlighted\">s</span>tare <span class=\"img\"></span> at the monitor continuously </span>"
So, here we are looking for all spans and checking them for content that has stare word. Then we change content. That's all, and learn nokogiri.

That's really simple: parse the html, replace in the text nodes, print to html.
Nokogiri seems to be popular for that in Ruby.

Related

return html tags in the html text using re

I have html text and i just want to determine what are the html tags available in the text.
html_text = '<p class="gmail-m3464245979397595798gmail-m6143070745855285966gmail-m-3072962113628903492gmail-m-7999079541169053160wordsection1" style="margin:0in;margin-bottom:.0001pt">Position Title: Onsite Client Services Associate<br /> Duration: 7 months<br /> Location: Tempe, AZ 85282<br /> <br /> <b><u>Roles and responsibilities</u></b><o:p></o:p></p> <p class="gmail-m3464245979397595798gmail-m6143070745855285966gmail-m-3072962113628903492gmail-m-7999079541169053160wordsection1" style="margin-top:5.0pt;margin-right:0in;margin-bottom:0in;margin-left:.25in; margin-bottom:.0001pt"><span style="font-family:Symbol">·</span><span style="font-size:7.0pt"> </span>Primary function during peak season (July-December) will be an onsite presence at our large client in the Phoenix area. <o:p></o:p></p>'
As a first step I was parsing every tag from the text for every html tag
like html_text.find('</p>'). As it is very long to parse by checking with every tag, I was trying to use of regex
re.findall(r'\<\/.>', html_text)
The output of the above is ['</p>', '</b>', '</u>']. But I want the output to be ['</p>','</span>', '<br />', '</b>', '</u>']. So If I modify
re.findall(r'\<\/.*>', html_text)
presuming i can get </span>, I am getting the whole text.
['</u></b><o:p></o:p></p> <p class="gmail-m3464245979397595798gmail-m6143070745855285966gmail-m-3072962113628903492gmail-m-7999079541169053160wordsection1" style="margin-top:5.0pt;margin-right:0in;margin-bottom:0in;margin-left:.25in; margin-bottom:.0001pt"><span style="font-family:Symbol">·</span><span style="font-size:7.0pt"> </span>Primary function during peak season (July-December) will be an onsite presence at our large client in the Phoenix area. <o:p></o:p></p>']
Is there a way I can write the expression for all tags as one expression or else should I write condition check for every tag ? In the above I couldn't determine <br />.
Finally after some little trails, I have found answer for my self, just posting it if it would help some one. It will determine all the tags, do some cleaning will determine the tags.
re.findall(re.compile("<.*?>"), html_text)
output is
['<p class="gmail-m3464245979397595798gmail-m6143070745855285966gmail-m-3072962113628903492gmail-m-7999079541169053160wordsection1" style="margin:0in;margin-bottom:.0001pt">', '<br />', '<br />', '<br />', '<br />', '<b>', '<u>', '</u>', '</b>', '<o:p>', '</o:p>', '</p>', '<p class="gmail-m3464245979397595798gmail-m6143070745855285966gmail-m-3072962113628903492gmail-m-7999079541169053160wordsection1" style="margin-top:5.0pt;margin-right:0in;margin-bottom:0in;margin-left:.25in; margin-bottom:.0001pt">', '<span style="font-family:Symbol">', '</span>', '<span style="font-size:7.0pt">', '</span>', '<o:p>', '</o:p>', '</p>']
As far as I know, what you are trying to do won't be fully achievable with just regex.
Usually, in an HTML tag there are attributes inside the opening tag. For example-
<span class="text">Some Text </span> has class="text" between the opening <span and the closing >.
So, if you want to just match <span> from <span class="text">Some Text </span>, you'll have to match <span first and then somehow skip class="text" and match > again. Which is not possible with regex as regex can only match characters one after another.
One solution that comes to my mind is, you can use this regex (<[^\/\s]+)([^>]+)>. Which will match <span class="text">Some Text </span> and return <span. You can then just add > after that using string concatenation.
Regex Explanation-
Thanks.

RegEx Removing Span tags from HTML

I need some RegEx for removing span tags with a specific class including the end tag but don't want to remove what's in between ...
I do not want to remove any other span tags
I cannot come up with it since I tend to forget the RegEx Tricks :(
I have this
<span class="SpellE">system_user.user_name</span>
<span>This is some text</span>
<Span class="OtherCLass">Some other text</span>
<span class="SpellE">system_user.userid</span>
And I want this result
system_user.user_name
<span>This is some text</span>
<Span class="OtherCLass">Some other text</span>
system_user.userid
Yes I need to tidy up some messy MS Html :)
Thanks in advance
The following regex should match what you want:
<span class=\"SpellE\">(.*)</span>
It matches the span with class='SpellE', creating a Group of the span text.
Then you should replace the match with Group 1.
In JavaScript, you can use it like this:
var testStr = '<span class="SpellE">system_user.user_name</span>\n'
+ '<span>This is some text</span>\n'
+ '<Span class="OtherCLass">Some other text</span>\n'
+ '<span class="SpellE">system_user.userid</span>\n';
var regex = /<span class=\"SpellE\">(.*)</span>/gi;
var result = testStr.replace(regex, '\1');
Now the result should be your wanted output.

Delete an HTML element containing a pattern

How can I delete elements (from <span> to </span>) whose text contain PATTERN in it? The contents of the element should be deleted along with the element.
For example, I want to delete the first <span>...</span> element in the following:
<span><SPAN>some text with
with </SPAN> a PATTERNin it etc</span><span><SPAN>some text
without </SPAN> a thingIn it etc</span>
to produce, using SED only :
<span><SPAN>some text
without </SPAN> a thingIn it etc</span>
PS: No help with end of lines or solo words, it must just detect any <span>...</span> and PATTERN.
Production server only allow basic commands such as SED.
I'm currently using the following but it's ugly and doesn't seem to work.
sed '/<span.*\n.*PATTERN.*<\/span>/d'
If HTML:
perl -MXML::LibXML -e'
my $parser = XML::LibXML->new();
my $doc = $parser->parse_html_file($ARGV[0]);
$_->unbindNode()
for $doc->findnodes(q{//span[contains(text(), "PATTERN")]});
binmode(STDOUT);
print($doc->toString());
' in.html >out.html
If XHTML:
perl -MXML::LibXML -e'
my $parser = XML::LibXML->new();
my $doc = $parser->parse_file($ARGV[0]);
my $xpc = XML::LibXML::XPathContext->new();
$xpc->registerNs( h => "http://www.w3.org/1999/xhtml" );
$_->unbindNode()
for $xpc->findnodes(q{//h:span[contains(text(), "PATTERN")]}, $doc);
binmode(STDOUT);
print($doc->toString());
' in.xhtml >out.xhtml
The above both produce the following (with some implied elements vivified):
<span><SPAN>some text
without </SPAN> a thingIn it etc</span>

Use regular expressions to add new class to element using search/replace

I want to add a NewClass value to the class attribute and modify the text of the span using find/replace functionality with a pair of regular expressions.
<div>
<span class='customer' id='phone$0'>Home</span>
<br/>
<span class='customer' id='phone$1'>Business</span>
<br/>
<span class='customer' id='phone$2'>Mobile</span>
</div>
I am trying to get the following result using after search/replace:
<span class='customer NewClass' id='phone$1'>Organization</span>
Also curious to know if a single find/replace operation can been used for both tasks?
Regex can do this, but be aware the using regex to change HTML can have a lot of edge cases that you may not have accounted for.
This regex101 example shows those three <span> elements changed to add NewClass and the contents to be changed to Organization.
Other technologies, however, would be safer. jQuery, for example, could replace them regardless of the order of the attributes:
$("span#phone$1").addClass("NewClass");
$("span#phone$1").text("Organization");
So just be careful with it, and you should be fine.
EDIT
According to comments on the OP, you want to only change the span containing ID phone$1, so the regex101 link has been updated to reflect this.
EDIT 2
Permalink was too long to fit into a comment, so adding the permalink here. Click on the "Content" tab at the bottom to see the replacement.
You can use a regex like this:
'.*?' id='phone\$1'>.*?<
With substitution string:
'customer' id='phone\$1'>Organization<
Working demo
Php code
$re = "/'.*?' id='phone\\$1'>.*?</";
$str = "<div>\n <span class='customer' id='phone\$0'>Home</span>\n<br/>\n <span class='customer' id='phone\$1'>Business</span>\n<br/>\n <span class='customer' id='phone\$2'>Mobile</span>\n</div>";
$subst = "'customerNewClass' id='phone\$1'>Organization<";
$result = preg_replace($re, $subst, $str);
Result
<div>
<span class='customer' id='phone$0'>Home</span>
<br/>
<span class='customerNewClass' id='phone$1'>Organization</span>
<br/>
<span class='customer' id='phone$2'>Mobile</span>
</div>
Since your tags include preg_match and preg_replace, I think you are using PHP.
Regex is generally not a good idea to manipulate HTML or XML. See RegEx match open tags except XHTML self-contained tags SO post.
In PHP, you can use DOMDocument and DOMXPath with //span[#id="phone$1"] xpath (get all span tags with id attribute vlaue equal to phone$1):
$html =<<<DATA
<div>
<span class='customer' id='phone$0'>Home</span>
<br/>
<span class='customer' id='phone$1'>Business</span>
<br/>
<span class='customer' id='phone$2'>Mobile</span>
</div>
DATA;
$dom = new DOMDocument('1.0', 'UTF-8');
$dom->loadHTML($html, LIBXML_HTML_NOIMPLIED | LIBXML_HTML_NODEFDTD);
$xp = new DOMXPath($dom);
$sps = $xp->query('//span[#id="phone$1"]');
foreach ($sps as $sp) {
$sp->setAttribute('class', $sp->getAttribute('class') . ' NewClass');
$sp->nodeValue = 'Organization';
}
echo $dom->saveHTML();
See IDEONE demo
Result:
<div>
<span class="customer" id="phone$0">Home</span>
<br>
<span class="customer NewClass" id="phone$1">Organization</span>
<br>
<span class="customer" id="phone$2">Mobile</span>
</div>

Scraping with Nokogiri::HTML - Can't get text from XPATH

I'm trying to scrape html with Nokogiri.
This is the html source:
<span id="J_WlAreaInfo" class="wl-areacon">
<span id="J-From">山东济南</span>
至
<span id="J-To">
<span id="J_WlAddressInfo" class="wl-addressinfo" title="全国">
全国
<s></s>
</span>
</span>
</span>
I need to get the following text: 山东济南
Checked shortest XPATH with firebug:
//*[#id="J-From"]
Here is my ruby code:
doc = Nokogiri::HTML(open("http://foo.html"), "UTF-8")
area = doc.xpath('//*[#id="J-From"]')
puts area.text
However, it returns nothing.
What am I doing wrong?
However, it returns nothing. What am I doing wrong?
xpath() returns an array containing the matches (it's actually called a NodeSet):
require 'nokogiri'
html = %q{
<span id="J_WlAreaInfo" class="wl-areacon">
<span id="J-From">山东济南</span>
至
<span id="J-To">
<span id="J_WlAddressInfo" class="wl-addressinfo" title="全国">
全国
<s></s>
</span>
</span>
</span>
}
doc = Nokogiri::HTML(html)
target_tags = doc.xpath('//*[#id="J-From"]')
target_tags.each do |target_tag|
puts target_tag.text
end
--output:--
山东济南
Edit: You can actually call text() on the Array, but it will return the concatenated results of the text for each match in the array--which is not something I've ever found useful--but because there is only one match you should have gotten the result 山东济南. There is nothing in your post that indicates why you didn't get that result.
If you only want a single result from your xpath, i.e. the first match, then you can use at_xpath():
target_tag = doc.at_xpath('//*[#id="J-From"]')
puts target_tag.text
--output:--
山东济南