如何使用css规则(-webkit column-width:)获取拆分后html页面特定列的内容

How to get content of particular column of html page after split using css-rule(-webkit-column-width:)

本文关键字:html 拆分 规则 css 何使用 -webkit column-width 获取      更新时间:2023-09-26

i使用css规则将html页面拆分为多列

var mySheet = document.styleSheets[0];
function addCSSRule(selector, newRule) 
{
   if (mySheet.addRule) {
       mySheet.addRule(selector, newRule);// For Internet Explorer                              
   } else {
       ruleIndex = mySheet.cssRules.length;
       mySheet.insertRule(selector + '{' + newRule + ';}', ruleIndex)//for firefox..
   }
}
addCSSRule('html', 'padding: 0px; height: 460px; -webkit-column-gap: 0px; -webkit-column- width: 320px;');

如何从特定专栏中获取内容。请帮帮我。

我确信没有简单的方法可以做到这一点。你最好的办法是找到文本的长度,然后得到内容的前半部分(或第三部分,或第四部分,视情况而定)。它不会准确,但会很接近。

另一种方法可以是从顶部开始选择内容,并根据插入符号的位置来计算列的末尾。(我只是在这里重复。不确定这是否真的有效)

我可以在一个小时后获得内容以进行查找和部署。我希望我的分享能帮助到别人
请登录:jsfiddle.net/coongtakien/7YMSL/1/

您可以更改起点和终点的位置,并计算每列的高度。最后,您更改我的硬固定代码并获取内容
感谢mattsven分享javascript中的createRange。有一个漂亮的代码!