Javascript 求未知数量数字的平均值

Javascript 求未知数量数字的平均值,javascript,html,Javascript,Html,在这篇文章中,我有几个与同一件事相关的不同问题 (此代码允许您插入分数并查找分数的平均值) 1.当数量未知时,我如何才能做到这一点?为了实现这一点,我将对三个数字进行((eng1n+eng2n+eng3n)/(eng1d+eng2d+eng3d))*100(以n结尾的变量是分数的分子,而以d结尾的变量是分母),但对于数量未知的数字,我将如何做到这一点 2.我将以6个输入开始网页(3个分数,因为我有一个输入用于分子,一个输入用于分母),但是我如何制作一个按钮来创建另一组输入 这通常很容易,但我如何

在这篇文章中,我有几个与同一件事相关的不同问题

(此代码允许您插入分数并查找分数的平均值)

1.当数量未知时,我如何才能做到这一点?为了实现这一点,我将对三个数字进行
((eng1n+eng2n+eng3n)/(eng1d+eng2d+eng3d))*100
(以n结尾的变量是分数的分子,而以d结尾的变量是分母),但对于数量未知的数字,我将如何做到这一点

2.我将以6个输入开始网页(3个分数,因为我有一个输入用于分子,一个输入用于分母),但是我如何制作一个按钮来创建另一组输入

这通常很容易,但我如何做到这一点,使他们每个人都有自己独特的id?ID将遵循一种模式(engNUMBERn、engNUMBERd,每个集合的编号比最后一个集合高一个),这可能使这成为可能。然而,在不知道它们的数量的情况下,将它们纳入上述等式也是一个挑战

3.我的最后一个问题应该不会太难,假设我们有两个分数,所以方程是
((eng1n+eng2n)/(eng1d+eng2d))*100
。我怎样才能做到,如果只填充了分数的分子或分母,那么分子和分母都会从方程中移除?谢谢

代码:

1) 带有for循环的数组,或

2) 您将拥有一个父div,单击按钮,您将使用
document.createElement
创建一个元素,然后使用
element.appendChild
将其追加。您可以制作一个减法按钮来删除最近的一个,或者您可以将每个集合放入包装器中,然后添加一个按钮来删除每个集合中的包装器,如第一个屏幕上所示。您可以使用
document.createElement
为每个元素创建一个新ID,但这似乎很麻烦,所以我建议您阅读div。我在游戏中使用
Array.from(document.querySelector(.wrapper>input))
(因为我只有一个输入,对您来说可能会更复杂一些)循环遍历该数组以获取值

编辑:查看评论,Slava Knyazev指出,您可以简单地为每个输入添加一个类,虽然这是我暗示的,但我并没有真正说清楚。这肯定是更容易的方法,即使创建一个减法按钮可能有点困难

3) 如果
.value
为空字符串(或0,因为您使用的是
type=“number”
),则在用于读取它的任何函数中跳过它


祝你好运

以下是您要寻找的函数:

函数平均值(){

对于(var i=0,sum=0,l=arguments.length;i这是您要查找的代码。我重新生成了您的函数,并添加了一个以添加新分数

这就是我所改变的:

  • 我做了一个按钮,插入分数元素,这样你就可以添加为 你要多少就多少

  • 删除
    input
    id,并为不同的值赋予类

  • 重新编写
    update()
    函数,使其可以处理任意数量的输入

    希望这就是你想要的。如果需要,很乐意解释或帮助你找到更好的解决方案

  • 函数更新(){
    var nums=document.getElementsByClassName('num');
    var dens=document.getElementsByClassName('den');
    var-sumN=0;
    对于(变量i=0;i
    .class{
    字体大小:粗体;
    }
    .type{}
    .输入{
    左:0;
    宽度:14px;
    边界:0;
    方向:ltr;
    }
    输入::-webkit外部旋转按钮,
    输入::-webkit内部旋转按钮{
    -webkit外观:无;
    保证金:0;
    }
    
    英语1
    书本测验
    /
    
    新的
    看起来有点像作业tbhIt不是,我只是在做大量的随机项目来帮助我学习代码,我决定尝试做一些东西,让你编辑成绩册中的某些作业,看看它如何影响你的成绩。这不是很容易,因为它们都是权重。你找不到未知数量的nu的平均值考虑到平均数定义为一组数字的总和除以集合中的数字计数……如果这是未知的,那么你怎么能得到总数,更不用说计数了?(我假设数学不是成绩册上的科目之一:p)我太累了,写不出正确的答案。相反,这里有两条路径需要研究:按公共属性(如类)选择元素然后对其执行数组操作。或者,编写一个循环,尝试选择具有下一个标识符的元素,直到它不返回匹配的元素,然后执行数组操作。为什么不使用array.reduce进行求和?例如:
    array.reduce((acc,curr)=>acc+curr)
    。此外,将数组作为参数会更容易,因为使用几个不同的未知长度数调用会更容易。这使代码更高效,并解决了必须执行
    平均值的问题。应用(null,nums)
    在我看来,这个
    平均值
    函数比Andrew真正能用的更通用。现在我只是在笑。函数应该是通用的。我的平均值函数接受任意数量的参数并给出平均值。
    .apply()
    用于将数组作为一组参数传递。我了解数组的作用。我知道在许多情况下,
    <!DOCTYPE html>
    
    <link rel="stylesheet" href="style.css">
    
    <div id='english' class='class'>English 1</div>
      <div id='engBookTests' class='type'>Book Tests</div>
      <div>
    <div><input id='eng1n' type='number' placeholder='##' onkeyup='update()' onchange='update()' class='input'>/<input id='eng1d' type='number' placeholder='##' onkeyup='update()' onchange='update()' class='input'></div>
    <div><input id='eng2n' type='number' placeholder='##' onkeyup='update()' onchange='update()' class='input'>/<input id='eng2d' type='number' placeholder='##' onkeyup='update()' onchange='update()' class='input'></div>
    <div><input id='eng3n' type='number' placeholder='##' onkeyup='update()' onchange='update()' class='input'>/<input id='eng3d' type='number' placeholder='##' onkeyup='update()' onchange='update()' class='input'></div>
    </div>
    
    <script>
    function update() {
      var eng1n = document.getElementById('eng1n').value;
      var eng1d = document.getElementById('eng1d').value;
      var eng2n = document.getElementById('eng2n').value;
      var eng2d = document.getElementById('eng2d').value;
      var eng3n = document.getElementById('eng3n').value;
      var eng3d = document.getElementById('eng3d').value;
      if (eng1n != "" && eng1d != "") {
        var engBTA = ((eng1n + eng2n + eng3n) / (eng1d + eng2d + eng3d)) * 100
        document.getElementById('engBookTests').innerHTML = "Book Tests (" + engBTA + "%)"
      }
    }
    </script>
    
    .class {
      font-weight: bold;
    }
    
    .type {
    }
    
    .input {
      left: 0;
      width: 14px;
      border: 0;
      direction: ltr;
    }
    
    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }