而且给的数据是HTML代码串,比如这样:
When intercepting, the content inside the div tag must be intercepted, and the HTML tag must be retained, and only the text in it must be processed. For example, I may just intercept the word "李" in "李思", but if I put it on the front end like this, the a tag in front of "李思" will not be closed, so after intercepting, I need to ensure that the HTML syntax is correct.
This problem is really not easy to solve, and it made me depressed for two days. Please note that this is just a string, but the content is HTML code and there is no DOM. It would be easier if it were processed on the front end. You can directly obtain the DOM, then process the nodes inside, and finally output things like innerHTML. It doesn't work now, I have to change my mind. My colleague’s thinking is this:
Loop through each character of the string. Set a tag, and set it to 1 when it encounters the tag < at the beginning of the tag. The following characters will not be counted, and then start counting after encountering >. When processing the string inside the label, you must first determine whether the current character encoding may be Chinese. Generally speaking, the length of UTF-8 encoded Chinese characters in PHP is 3, so if you encounter a Chinese character encoding , I have to skip two uncounted ones... At this point, my head is starting to get big. Personally, I think this method is very unpleasant. First of all, this kind of exquisite logic is not easy to control, andThe length of Chinese generated under UFT-8 encoding may be 3 or 4so the rigor of the code is questionable. .
My personal idea is to use Tidy (please see the PHP manual for specific usage). I studied Tidy yesterday and found that this thing is quite useful. First, convert this string into a Tidy object, like this:
$tidy = tidy_parse_string($str, array(), 'utf8′); // The last one is to set the encoding. Note that here isutf8, notutf-8, there is no connecting line in the middle.
Then get the body in $tidy (because $tidy will automatically add tags such asafter conversion):
$body = tidy_get_body($tidy);
At this time, you can use var_dump to look at some $body structures, and you will find that it turns each tag into a corresponding object with corresponding attributes. For example, such assdf, some attributes corresponding to such a statement are:
name=>”a”
value => “sdf”
child=> array{[0]=>a Text node object, value is sdf}
attribute=array{”href”=>”#”}
…..Other attributes
As you can see, we can actually process the value of the text node below the node corresponding to the a tag separately, so that it will not destroy any HTML integrity. Originally, I thought that after changing the value of the text node in the a tag, the value of the a tag would also change accordingly. In that case, it would be OK if I directly returned the value of the node corresponding to the a tag. I didn't expect it to be like that. Alas, so I processed the text in it. Then you still have to spell out the new HTML yourself.
After knowing the structure of the Tidy object, everything is easy to handle. Just traverse all the nodes. For this requirement, it is to find the div tag and then start processing the nodes inside. The code is as follows:
if(mb_strwidth($subchild->value, 'utf-8′) >= $len)
{
$subchild->value = mb_strimwidth($subchild->value, 0 , $len, '…', 'utf-8′);
$trimed_str .= $subchild->value;
break;
}
else
{
$ trimed_str .= $subchild->value;
$len = $len - mb_strwidth($subchild->value, 'utf-8′);
}
The $subchild inside is a child node. Note thatmb_strwidthis used here to get the string length. I highly recommend thismb_strwidth, it’s very useful. It will treat Chinese as two characters in length, which exactly meets the needs here! Moreover,mb_strimwidthis used when intercepting strings. This function will also treat Chinese as two characters in length. Functions starting with mb_ are really easy to use.
I won’t write out the specific code, because it is written based on a requirement and is not made into a universal form. One day I have time to make it universal and publish it.
In addition, it is a pity that FireFox does not support the text-overflow attribute, otherwise there would be no need to work so hard in the background to truncate it. If you have a better method, please feel free to suggest it! Any help is greatly appreciated.