使用Javascript / jQuery将HTML分成多列 [英] Splitting HTML into multiple columns with Javascript/jQuery
本文介绍了使用Javascript / jQuery将HTML分成多列的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
注意:这是针对此问题的另一种计划方法: Joomla中的多栏文章
Note: This is an alternate planned approach to this question: Multiple column articles in Joomla
我有一个客户需要多列布局,应该从非列HTML块自动生成。
I've got a client who wants a multi column layout, which should be generated automatically from a non-column HTML block.
使用JavaScript(和jQuery)从单个HTML块创建多列系统的可行性如何?如果可能的话我该怎么做呢?
What is the feasibility of using JavaScript (and jQuery) to create a multi-column system from a single block of HTML? And if it is possible how would I go about doing it?
谢谢。
Thanks.
推荐答案
这只是一个例子,你可以如何解决你的问题。
This is just an example how you can solve your problem. Of cause this solution can be refined.
function textSplitter(){
}
textSplitter.prototype.LENGTH_TO_SPLIT=5000 //max chars in single line
textSplitter.prototype.split=function(id){
var contentDiv=document.getElementById(id); // get an element
var text=contentDiv.innerHTML;
var length= text.length;
if(length){
var div1sbstr=text.substring(0,this.LENGTH_TO_SPLIT); //take a substring
var div1=document.createElement("div");
contentDiv.appendChild(div1); // append it
}
if(length>this.LENGTH_TO_SPLIT){
var div2sbstr=text.substring(this.LENGTH_TO_SPLIT,this.LENGTH_TO_SPLIT*2);
var div2=document.createElement("div");
contentDiv.appendChild(div2);
}
if(length>this.LENGTH_TO_SPLIT*2){
var div3sbstr=text.substring(this.LENGTH_TO_SPLIT*2,this.LENGTH_TO_SPLIT*3);
var div3=document.createElement("div");
contentDiv.appendChild(div3);
}
}
这篇关于使用Javascript / jQuery将HTML分成多列的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文