javascript-如何在webkit中获取多列布局中的列数

我有一些静态HTML内容.我需要使用多列对其进行格式化,然后将其作为页面呈现给用户.我用一些很简单的东西归结为：

bodyID = document.getElementsByTagName('body')[0];
bodyID.style.width = desiredWidth;
totalHeight = bodyID.offsetHeight;
pageCount = Math.ceil(totalHeight/desiredHeight);
bodyID.style.width = desiredWidth*pageCount;
bodyID.style.height = desiredHeight;
bodyID.style.webkitColumnGap = 0;
bodyID.style.webkitColumnCount = pageCount;

现在,我的问题是,webKit会按照应有的方式尊重height属性,并且可以创建比要求的内容(如果内容不适合pageCount的列数)更多的列.

之后,我需要能够获取列数才能正确实现分页.但是,即使有更多列,document.getElementsByTagName(‘body’)[0] .style.webkitColumnCount的值也不会与pageCount相同.

有什么想法,如何获得渲染列的总数？

提前致谢.

解决方法:

事实证明,该解决方案比我想象的要简单得多.只需使用bodyID.scrollWidth获取页面的实际宽度,然后除以期望的宽度即可获得页面的实际数量.

希望这对某人有帮助.

标签：html5,css3,webkit,multiple-columns,javascript
来源： https://codeday.me/bug/20191208/2093402.html