我试图制作一个计数器，看看我正在为这个项目制作多少行代码。所以我要做的就是创建一个简单的JavaScript文件，对多个文件中的每一行进行计数，然后将其添加到总计中。我需要对任何空行进行计数，然后将其输出到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>
/*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次。应该有两个单独的文件;一个script.js文件，它将其写入HTML文件，ofc，counter.html文件与脚本链接。
答案 0 :(得分：0)
喜欢这个吗？
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;})过滤掉空行