A solution for wrapping CSS consecutive characters

Two new properties are added to the processing of the text word-wrap and word-break to solve the problem:

{Word-break:break-all;} : The text rules for Asian and non-Asian languages allow line breaks within words and allow any word in non-Asian text lines to be disconnected
{Word-wrap:break-word;} : Content will be wrapped within the boundary, if necessary, the word line wrap (Word-break) also occurs

	IE6/7/8[1]	FIREFOX2/3[2]	Firefox3.5	opera9+	Safari9.5+/chrome
{Word-wrap:break-word;}	TD elements need to set their width See Example 4 and Case 5	does not support	TD Element not supported See Example 4 and Case 5	does not support	TD Element not supported See Example 4 and Case 5
{Word-break:break-all;}	Consecutive symbols not supported See Example 3	does not support	Consecutive symbols not supported See Example 3	does not support	Support

1] As you can see in the MSDN CSS compatibility and Internet Explorer, IE8 will support both Word-wrap and Word-break properties like IE6 and IE7. But I did not support these two items on the IE8BETA2 test, because IE8 is still in beta phase, and I believe IE8 will eventually support, so in the page header declaration <meta content= "ie=7" http-equiv= "x-ua-compatible" /> Make IE8 follow IE7 to explain the page is a good way. IE8 Official version Support
[2] Firefox3.1 will support Word-wrap Properties FIREFOX3.5BETA4 has supported
Due to {word-break:break-all;} Causes the English and the digital readability to be severely degraded and cannot wrap the consecutive symbol, so {word-wrap:break-word;} is a relatively good choice. Note that the various browsers in the Word-wrap on the TD to achieve inconsistent, so to avoid direct use on the TD.

But with the browser's poor support, JavaScript is the only way to solve the problem, which is to insert the & #8203 in the proper position of a contiguous string when the browser does not support CSS solutions (<wbr/> and &shy, of course). , this three-character support in the browser see PPK's "The WBR tag", these characters are written in the browser does not appear, but the long string wrapping. & #8203; and &shy; will result in a large number of characters that cannot be printed when the text is processed with it, resulting in a sharp increase in the number of characters and, more seriously, the/> of the copied link string, so it is a good scheme to use <WBR, although <WBR/ > is not supported in IE8 and has bugs in Safari, but these browsers can be implemented directly with Css{word-wrap:break-word} without <wbr/> processing. Opera to be compatible with <WBR/>, you need to set CSS:wbr:after {content: "0200B"}.

2009.05.28 rewrite the implementation method to minimize the dependency on browser detection while considering the efficiency of performing the method multiple times on the same page, while in order to be lazy directly based on Yui.
function Fnbreakwordall (o) {
var o = O | | {},
Iword = O.word | | 13,
IRe = O.re | | ' [a-za-z0-9] ',
BAll = O.all | | False
Sclassname = O.classname | | ' Word-break-all ',
Aels = O.els | | (function () {
var aels = [],
Aallels = document.getElementsByTagName (' * '),
Re = new RegExp ('?: ^| \s+) ' + Sclassname + ' (?: \ s+|$) ');
for (var i =0,ilen = Aallels.length i < Ilen; ++i) {
if (Re.test (Aallels[i].classname)) {
Aels[aels.length] = aallels[i];
}
}
return aels;
})() || [],
Fnbreakword = function (OEL) {
Based on http://www.hedgerwow.com/360/dhtml/css-word-break.html modification
if (!oel | | oel.nodetype!== 1) {
return false;
}else if (oel.currentstyle && typeof oel.currentstyle.wordwrap=== ' string ') {
Breakword = function (OEL) {
OEl.runtimeStyle.wordWrap = ' Break-word ';
return true;
}
Return Breakword (OEL);
}else if (document.createtreewalker) {
var trim = function (str) {
str = str.replace (/^ss*/, "");
var ws =/s/,
i = str.length;
while (Ws.test (Str.charat));
Return Str.slice (0, i + 1);
}
Breakword = function (OEL) {
var dwalker=document.createtreewalker (Oel,nodefilter.show_text,null,false);
var node,s,c = String.fromCharCode (' 8203 '),
Re =/([a-za-z0-9]{0,13})/;
Re = new RegExp (' + iRe + ' {0, ' + Iword + '} ');
while (Dwalker.nextnode ()) {
node = Dwalker.currentnode;
s = Trim (Node.nodevalue). Split (re). Join (c);
Node.nodevalue = s;
}
return true;
}
Return Breakword (OEL);
}
};
for (var i=0,n=aels.length; i<n; ++i) {
var sUa = navigator.useragent,
STn = Aels[i].tagname.tolowercase ();
if ((/opera/). Test (sUa) | | (/firefox/). Test (sUa) | | ((/khtml/). Test (SUa) &&
(STN = = ' td ' | | | stn = = ' th ')] || BALL) {
Fnbreakword (Aels[i]);
}
}
}

The Fnwordbreakall function provides some customization parameters, using the method and parameter meanings as follows:

Fnwordbreakall ({word:15,re: ' [\w] ', all:true});

Parameters	value	Description
Word	Positive integer, default is 13	Words in this word will not be inserted into the u8203, the impression of more than 13 letters of words not much, which can guarantee that most of the words will not be broken
Re	Regular expressions, default [a-za-z0-9]	A regular expression of a word that determines which characters consist of a word, and the escape of attention
All	Boolean value, default False	Determines whether to execute in all browsers, by default in opera and Firefox, and when class is applied to Safari on th or TD, which is mainly used when. Word-break-all is not defined, the IE style is added
ClassName	Legal class name, default Word-break-all	Property name of the element corresponding to the execution function