開發各種項目中經常遇到截取html字元串問題。 比如部落格文章清單頁面截取一部分正文、文章正文翻頁截取等
一般情況下先用PHP的 strip_tags 函數去掉所有html标簽,再去掉空格等,然後再用substr或者自己實作的cn_substr函數來實作截取。因為如果不先去掉html标簽,直接截取出來的字元串就會有沒有閉合的标簽出現,有時甚至會截取在标簽上面比如
今天遇到一個内容翻頁截取問題: 正文是用富文本編輯器寫入的,編輯器上有個分頁按鈕,點選之後就往目前光标位置插入一個藍色的
橫線。然後php直接存入資料庫。顯示的時候,用 explode 函數根據這個
标記來分成一個數組,然後根據目前頁碼來顯示某個片段。 但是有個嚴重的問題,比如富文本編輯器寫入:
content of page 1
page 2 content
如果用explode函數分開後,
第一頁的内容是
content of page 1
第二頁的内容是:
page 2 content
這樣就産生了沒有閉合的标簽,直接顯示到頁面上面就會破壞頁面布局。。。
想了很久,也找了網上很多 closetag函數。但是發現都針對第一頁那種沒有閉合的标簽的閉合。對于第二種沒有開頭的标簽就沒辦法了。
針對第一頁那種沒有閉合的标簽的閉合的closetags方法是:
function closetags($html) {
// 不需要補全的标簽
$arr_single_tags = array('meta', 'img', 'br', 'link', 'area');
// 比對開始标簽
preg_match_all('##iU', $html, $result);
$openedtags = $result[1];
// 比對關閉标簽
preg_match_all('#([a-z]+)>#iU', $html, $result);
$closedtags = $result[1];
// 計算關閉開啟标簽數量,如果相同就傳回html資料
$len_opened = count($openedtags);
if (count($closedtags) == $len_opened) {
return $html;
}
// 把排序數組,将最後一個開啟的标簽放在最前面
$openedtags = array_reverse($openedtags);
// 周遊開啟标簽數組
for ($i = 0; $i < $len_opened; $i++) {
// 如果需要補全的标簽
if (!in_array($openedtags[$i], $arr_single_tags)) {
// 如果這個标簽不在關閉的标簽中
if (!in_array($openedtags[$i], $closedtags)) {
// 直接補全閉合标簽
$html .= '' . $openedtags[$i] . '>';
} else {
unset($closedtags[array_search($openedtags[$i], $closedtags)]);
}
}
}
return $html;
}
後來想了一個辦法,利用浏覽器自己的html解釋引擎來幫助補全有問題的html片段。具體做法如下:
var div = document.createElement('div');
div.innerHTML ='<?php echo ("
這裡是被截取的html片段");?>';
document.write(div.innerHTML);
原理就是先把html片段寫入到一個空的div裡面,然後再從這個div裡面讀取出來。别看寫入和讀取的屬性都是innerHTML,寫入的内容和得到的内容是不一樣的噢。如果寫入不完整的html片段,浏覽器會自動補全修正。讀取出來的時候就已經是完整的html dom 片段了。
可是這樣有個弊端,由于是Js加載内容資訊的,會對搜尋引擎優化不好。