我在使用 hpple 库解析 HTML 内容时遇到问题。
我想使用 textkit 来显示一个好的 html 内容。
所以这是我的问题。
我想用我自己的标签替换所有图像或视频标签,然后在 UITextview 上用 textkit 插入它。
我的算法:
我解析我的 html 内容
如果 [the element raw] 包含带有正则表达式的 a ,我会使用正则表达式进行测试
如果是这样,我会提取我的视频图像的“src”并创建一个个性化的字符串
然后我想用我的新字符串替换整个 [element raw]
例如:
<p>
<img src="blablabla.jpg" />
</p>
看起来像:
\IMG\blablabla.jpg
然后我使用正则表达式删除所有 HTML 标签
我的问题是当我想用我的新标签“\IMG\blablabla.jpg”替换 [element raw] 时
我使用的正则表达式
#define REGEX_IMG_CONTENT @"<img[^>]+src=\"([^\">]+)\""
#define REGEX_IFRAME_CONTENT @"<iframe[^>]+src=\"([^\"]+).*?</iframe>"
#define REGEX_ALL_BALISE @"<(?:\"[^\"]*\"['\"]*|'[^']*'['\"]*|[^'\">])+>"
初始化我的自定义 NSTextstorage
_textStorage = [[HTMLTextStorage alloc]init];
NSDictionary *attrs = @{NSFontAttributeName:[UIFont preferredFontForTextStyle:UIFontTextStyleBody]};
NSAttributedString *attrString = [[NSAttributedString alloc] initWithString:[self.textStorage formatedHTMLStringWithString:self.post.wpContent] attributes:attrs];
用我自己的标签格式化我的 HTML 字符串
- (NSString *)formatedHTMLStringWithString:(NSString *)string {
NSData *tutorialsHtmlData = [string dataUsingEncoding:NSUTF8StringEncoding];
TFHpple *tutorialsParser = [TFHpple hppleWithHTMLData:tutorialsHtmlData];
NSString *tutorialsXpathQueryString = @"//p";
NSArray *tutorialsNodes = [tutorialsParser searchWithXPathQuery:tutorialsXpathQueryString];
for (TFHppleElement *element in tutorialsNodes) {
NSString *imageRegexString = REGEX_IMG_CONTENT;
NSString *videoRegexString = REGEX_IFRAME_CONTENT;
[self formatElement:element withRegexString:imageRegexString andInitialString:string];
[self formatElement:element withRegexString:videoRegexString andInitialString:string];
}
NSError *error = nil;
NSRange range = NSMakeRange(0, string.length);
NSString *htmlBalisesRegexString = REGEX_ALL_BALISE;
NSRegularExpression *reg = [NSRegularExpression regularExpressionWithPattern:htmlBalisesRegexString options:0 error:&error];
NSString *finalString = [reg stringByReplacingMatchesInString:string options:0 range:range withTemplate:@""];
return finalString;
}
- (void)formatElement:(TFHppleElement *)element withRegexString:(NSString *)regexString andInitialString:(NSString *)initialString{
NSString *raw = [[element raw] stringByDecodingHTMLEntities];
NSError *error = nil;
NSRange range = NSMakeRange(0, raw.length);
NSRegularExpression *reg = [NSRegularExpression regularExpressionWithPattern:regexString options:0 error:&error];
NSArray *matches = [reg matchesInString:raw options:0 range:range];
if (matches.count != 0) {
NSLog(@"initialString : %@",initialString);
NSLog(@"Paragraph contains regex : %@",raw);
NSArray *firstNode = [element children];
TFHppleElement *child = firstNode[0];
if ([child hasChildren]) child = [child children][0];
[self handleAllRegexFormatWithInitialString:initialString raw:raw child:child andRegexString:regexString];
}
}
- (void)handleAllRegexFormatWithInitialString:(NSString *)initialString raw:(NSString *)raw child:(TFHppleElement *)child andRegexString:(NSString *)regexString {
if ([regexString isEqualToString:REGEX_IMG_CONTENT]) initialString = [self formatedStringForChild:child withRaw:raw andInitialString:initialString andTag:@"IMG"];
else if ([regexString isEqualToString:REGEX_IFRAME_CONTENT]) initialString = [self formatedStringForChild:child withRaw:raw andInitialString:initialString andTag:@"VIDEO"];
}
- (NSString *)formatedStringForChild:(TFHppleElement *)child withRaw:(NSString *)raw andInitialString:(NSString *)initialString andTag:(NSString *)tag {
NSString *string = @"";
NSDictionary *attributes = [child attributes];
NSString *replacementImageString = [NSString stringWithFormat:@"\\%@\\%@",tag,[attributes objectForKey:@"src"]];
NSRange range = [initialString rangeOfString:raw];
NSLog(@"Range : %@",NSStringFromRange(range));
if (range.location != NSNotFound) string = [initialString stringByReplacingOccurrencesOfString:raw withString:replacementImageString];
return string;
}
在这种方法中,我的长度范围总是等于 0
这是我得到的一个例子:
初始html内容
initialString : <p style="text-align: center;">
<a href="http://www.tuxboard.com/cet-artiste-dessine-en-negatif">
<img class="alignnone size-medium wp-image-150233" alt="dessin negatif 640x398 Cet artiste dessine en négatif" src="http://www.tuxboard.com/photos/2013/12/dessin-negatif-640x398.jpg" width="640" height="398" title="Cet artiste dessine en négatif" />
</a>
</p>
<p>
<span id="more-150230"></span><br />
Réaliser des dessins hyperréalistes, c’est déjà assez costaud, mais savoir les faire <strong>en négatif</strong> se révèle être un exploit que l’artiste malaisien <strong>Brian Lai</strong> maitrise avec perfection.</p>
<p>Voici un exemple. D’un côté, le dessin comme on le verrait à l’œil nu, de l’autre côté, quand il est passé en négatif.</p>
<p style="text-align: center;">
<a href="http://www.tuxboard.com/photos/2013/12/negatif-dessin.jpg">
<img class="alignnone size-full wp-image-150234" alt="negatif dessin Cet artiste dessine en négatif" src="http://www.tuxboard.com/photos/2013/12/negatif-dessin.jpg" width="504" height="729" title="Cet artiste dessine en négatif" />
</a>
</p>
<p style="text-align: center;">
<a href="http://www.tuxboard.com/photos/2013/12/art-negatif.jpg">
<img class="alignnone size-medium wp-image-150235" alt="art negatif 640x428 Cet artiste dessine en négatif" src="http://www.tuxboard.com/photos/2013/12/art-negatif-640x428.jpg" width="640" height="428" title="Cet artiste dessine en négatif" />
</a>
</p>
<p>Vous pensez « fake » ? Vous vous trompez. L’artiste a même réalisé une vidéo pour expliquer sa technique.</p>
<div id="tuxplayer">Chargement du player …</div>
<p><script type="text/javascript">jwplayer("tuxplayer").setup({ flashplayer: "http://medias.tuxboard.com/playerv2.swf", file: "http://medias.tuxboard.com/Brian_Lai_Invert_Drawing.mp4",image: "http://www.tuxboard.com/photos/2013/12/Video-Brian-Lai-negatif.jpg", height: 370,width: '100%', 'plugins': 'sharing-3'});</script></p>
提取的[元素原始]
2013-12-19 11:40:50.247 Tuxboard[6279:70b] Paragraph contains regex :
<p style="text-align: center;">
<a href="http://www.tuxboard.com/cet-artiste-dessine-en-negatif">
<img class="alignnone size-medium wp-image-150233" alt="dessin negatif 640x398 Cet artiste dessine en négatif" src="http://www.tuxboard.com/photos/2013/12/dessin-negatif-640x398.jpg" width="640" height="398" title="Cet artiste dessine en négatif"/>
</a>
</p>
范围
2013-12-19 11:40:50.247 Tuxboard[6279:70b] Range : {2147483647, 0}
编辑
我已经手动提取了我希望我的算法提取的部分并将其与 HTML 解析器返回的 [element raw] 匹配,并且似乎 HTML 解析器删除了空格字符......