<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>页面分页</title>
<style type="text/css">
*
{
font-size: 10.2pt;
font-family: tahoma;
line-height: 150%;
}
.divContent
{
border: 1px solid red;
background-color: #FFD2D3;
width: 500px;
word-break: break-all;
margin: 10px 0px 10px;
padding: 10px;
}
</style>
</head>
<body>
<h1>标题</h1>
<div id="divContent">
</div>
<script type="text/javascript">
// input里面不允许包含：初中、中学、初级中学这三个词语
s="<p>女老师竭力向孩子们证明，学习好功课的重要性。 </p><img src=‘/login/image/password.png‘ /><p><table border=‘1‘><tr><td>111</td><td>user</td></tr><tr><td>111</td><td>username</td></tr><tr><td>111</td><td>username</td></tr></table>她说：“牛顿坐在树下，眼睛盯着树在思考，这时，<img src=‘/login/image/password3.png‘ />有一个苹果落在他的头上，于是他发现了万有引力定律，孩子们，你们想想看，做一位伟大的科学家多么好，多么神气啊，要想做到这一点，就必须好好学习。” </p><p>“班上一个调皮鬼对此并不满意。他说：“兴许是这样，可是，假如他坐在学校里，埋头书本，那他就什么也发现不了啦。” </p><p>女老师竭力向孩子们证明，学习好功课的重要性。 </p><p><table border=‘1‘><tr><td>111</td><td>username</td></tr><tr><td>111</td><td>username</td></tr><tr><td>111</td><td>username</td></tr></table>她说：“牛顿坐在树下，眼睛盯着树在思考，这时，有一个苹果落在他的头上，于是他发现了万有引力定律，孩子们，你们想想看，做一位伟大的科学家多么好，多么神气啊，要想做到这一点，就必须好好学习。” </p><p>“班上一个调皮鬼对此并不满意。他说：“兴许是这样，可是，假如他坐在学校里，埋头书本，那他就什么也发现不了啦。” </p><p>女老师竭力向孩子们证明，学习好功课的重要性。 </p><p>她说：“牛顿坐在树下，眼睛盯着树在思考，这时，有一个苹果落在他的头上，于是他发现了万有引力定律，孩子们，你们想想看，做一位伟大的科学家多么好，多么神气啊，要想做到这一点，就必须好好学习。” </p><p>“班上一个调皮鬼对此并不满意。他说：“兴许是这样，可是，假如他坐在学校里，埋头书本，那他就什么也发现不了啦。” </p><p>女老师竭力向孩子们证明，学习好功课的重要性。 </p><p>她说：“牛顿坐在树下，眼睛盯着树在思考，这时，有一个苹果落在他的头上，于是他发现了万有引力定律，孩子们，你们想想看，做一位伟大的科学家多么好，多么神气啊，要想做到这一点，就必须好好学习。” </p><p>“班上一个调皮鬼对此并不满意。他说：“兴许是这样，可是，假如他坐在学校里，埋头书本，那他就什么也发现不了啦。” </p><p>女老师竭力向孩子们证明，学习好功课的重要性。 </p><p>她说：“牛顿坐在树下，眼睛盯着树在思考，这时，有一个苹果落在他的头上，于是他发现了万有引力定律，孩子们，你们想想看，做一位伟大的科学家多么好，多么神气啊，要想做到这一点，就必须好好学习。” </p><p>“班上一个调皮鬼对此并不满意。他说：“兴许是这样，可是，假如他坐在学校里，埋头书本，那他就什么也发现不了啦。” </p>";
mainContent = s;
var tabReg = /(<table[^>]*>((?!table).)*<\/table>)+/gi;
var tabMatch = tabReg.test(s);
var tabMatchContentArray = [];
tabMatchContentArray = s.match(tabReg);
if(tabMatch)
{
mainContent = s.replace(tabReg,"#");
}
//alert(mainContent);
//对img标签进行匹配
var imgReg = /(<img\s+src=‘\S+‘\s*(\/)?>)/gi;
imgMatchContentArray = s.match(imgReg);
if(imgReg.test(s))
{
//将img标签替换为*
mainContent = mainContent.replace(imgReg,"*");
}
var pageIndex = 4;
var size = 100;
var tableContentArray = mainContent.split("#");
var array = [];
var arrayIndex = [];
var len =0;
for(var i=0;i<tableContentArray.length;i++)
{
var con = tableContentArray[i];
len += con.length;
arrayIndex[i] = len;
array[i] = Math.ceil(con.length /size);
}
var tableIndexArray = [];
var sum = 1;
for(var j=0;j<array.length-1;j++)
{
sum += array[j];
tableIndexArray[j] = sum;
}
//alert(tableIndexArray);
//alert(tableIndexArray.indexOf(pageIndex) );
var currentPageContent = mainContent.substr((pageIndex-1)*size,size);
alert(currentPageContent);
if(tableIndexArray.indexOf(pageIndex) >= 0)
{
alert(1111);
currentPageContent = tabMatchContentArray[tableIndexArray.indexOf(pageIndex)];
//alert(currentPageContent);
}
if(currentPageContent.indexOf("#")!= -1)
{
alert(222);
var beginToCurrentPageContent = mainContent.substr(0,pageIndex*size);
var tabLastIndex = beginToCurrentPageContent.lastIndexOf("#");
alert(tabLastIndex);
currentPageContent = currentPageContent.substr(0,tabLastIndex-(pageIndex-1)*size);
alert(currentPageContent);
//当前页是否有 * 获取最后一个 * 的位置
var indexOf = currentPageContent.indexOf("*");
if(indexOf >= 0)
{
//获取开始到当前页位置的内容 中的 * 的最后的下标
var reCount = beginToCurrentPageContent.split("*").length - 1;
var contentArray = currentPageContent.split("*");
currentPageContent = replaceImgContent(contentArray,reCount,imgMatchContentArray);
}
}
else
{
alert(22222);
//当前页是否有 * 获取最后一个 * 的位置
var indexOf = currentPageContent.indexOf("*");
if(indexOf >= 0)
{
//获取从开始位置到当前页位置的内容
var beginToCurrentPageContent = mainContent.substr(0,pageIndex*size);
//获取开始到当前页位置的内容 中的 * 的最后的下标
var reCount = beginToCurrentPageContent.split("*").length - 1;
var contentArray = currentPageContent.split("*");
currentPageContent = replaceImgContent(contentArray,reCount,imgMatchContentArray);
}
}
document.getElementById("divContent").innerHTML= currentPageContent;
/* currentArray:当前页以 * 分割后的数组
replaceCount:从开始内容到当前页的内容 * 的个数
matchArray ： img标签的匹配的内容
*/
function replaceImgContent(currentArray,replaceCount,matchArray)
{
var result = "";
for(var i=currentArray.length -1,j = replaceCount-1 ;i>=1; i--)
{
var temp = (matchArray[j] + currentArray[i]);
result = temp + result;
j--;
}
result = currentArray[0] + result ;
return result;
}
</script>
</body>
</html>
时间： 2024-10-12 07:27:35