如何计算多个文件的[组合]行长

How to Count [Combined] line length of multiple files?

本文关键字：文件 组合 行长 何计算 计算      更新时间：2023-09-26

我正在尝试制作一个计数器，以查看我总共为我正在处理的这个项目制作了多少行代码。所以我要做的是制作一个简单的JavaScript文件，它计算多个文件中的每一行，并将其加成一个总数。我需要计算任何空行，然后将其输出到 HTML 内容中的单独框中。

以下是 HTML 页面或类似内容的样子。

.HTML

<html>
<head>
  <style>
    #div1  {
      display: block;
      background: #444444;
      width: 100%
      height: 100%;
    }
    #div1 .container  {
      align: center;
      overflow: auto;
      width: 75%;
      height: 75%;
      display: block;
      background: #666666;
    }
    #div2  {
      display: block;
      background: #444444;
      width: 100%;
      height: 100%;
    }
    #div2 .container  {
      overflow: auto;
      width: 75%;
      height: 75%;
      display: block;
      background: #666666;
    }
  </style>
  <script src="script.js"></script>
  </head>
  <body>
    <div id="header">
    <h2>I Failed <u>391</u> Times!*</h2>
    <h6><i>*Before Giving Up</i></h6>
    </div>
    <div id="div1" class="div">
      <div class="container">
        <p>INSERT TOTAL LINES FROM 3 DIFFERENT FILES COMBINED</p>
      </div>
    </div>
    <div id="div2" class="div">
      <div class="container">
        <p>INSERT TOTAL USED LINES FROM 3 DIFFERENT FILES COMBINED</p>
      </div>
    </div>
  </body>
</html>

JavaScript

/*function myWorkingUnNeededFunction()  {;
var attempts = "381 + Counting";
var hdr1 = document.createElement("H2");
var txt1 = document.createTextNode("");
var i;
hdr1.appendChild("txt1");
document.getElementById("header").appendChild("hdr1");
for(i = 0; i < attempts.length; i++)  
{
  document.getElementByTagName("h2").innerHTML = "'Failed' + i + 'Times'";
}
myWorkingUnNeededFunction();
}
*/
function myBrokenCounter1()  {
  /* REALLY, REALLY long code of just failure... trust me, you do NOT want to see... I'll just show what I think could work, but not actually fill in certain parts as I am unaware. */
  var lines;
  var counter;
  var lines = document.getElementByClassName("div");
  if(lines.id = "div1")  {
   document.getElementById("div1").innerHTML = counterWithEmptyLines();
   document.getElementById("div2").innerHTML = counterWithUsedLines();
  }
  }
  /* What I was going for is that there will be two counters; one counting the line length of ALL lines, and one counting the line length of ALL **USED** lines. If the div class has a id of div1, the total counter will go to div1 with empty lines. Otherwise, it will go to div2 with the used & empty lines as well. */
  function counterWithLUsedLines()  {
    /* more fails with no knowledge of how to do it */
  }
  function counterWithLEmptyLines()  {
    /* EVEN more fails with no knowledge of how to do it */
  }

我试过了。HTML不会说谎;在放弃之前，我真的尝试了大约 390 次。应该有两个单独的文件;一个脚本.js文件，将其写入 HTML 文件，以及 ofc，带有脚本链接的计数器.html文件。

像这样？

1. document.getElementById("div1").innerHTML.split("'n").length;
2. document.getElementById("div2").innerHTML.split("'n").filter(function(l){return l.length;}).length;

text.split("'n").length为我们提供了行数
.filter(function(l){return l.length;})筛选出空行

相关文章：