Question

我想创建一个函数，该函数使用在html中输入的属性名称和值来计算我拥有的属性数量。

我不知道如何按属性名称和值进行计数！

就像当我在此html中输入“ type”和“ text”然后显示2一样！

我对javascript很陌生！如果您能帮助我，将非常感谢！谢谢

function javascript_click() { 
  if (document.getElementById("value3").value && document.getElementById("value4").value ) {
    var attName=document.getElementById("value3").value;
    var attValue=document.getElementById("value4").value;
    if((attName && attValue) !==''){
      var val3 = document.getElementById("value3");}
    else {
      document.getElementById("cnt").innerHTML += 
      "wrong value of ID <br>";
    }
  }
}

<form action="">
  <table class="tg" id="tg">
    <tr>
      <td>Attribute name</td>
      <td><input type="text" id="value3"></td>
    </tr>
    <tr>
      <td>attribute value</td>
      <td><input type="text" id="value4"></td>
    </tr>
  </table>
  <div id="cnt"></div>
</form>
<div class="button">
  <button id='btn_javascript' onclick="javascript_click();">javascript</button>
</div>

Answer 1

每次用户输入一对属性时，我都会将属性推入数组attRy中。

attRy.length将为您提供属性对的数量。

let attRy = []

function javascript_click() { 
  if (value3.value && value4.value ) {
    var attName = value3.value;
    var attValue = value4.value;
    if(attName !=='' && attValue !==''){
      attRy.push(attName + ": " +attValue);
      cnt.innerHTML = attRy.length +" attributes:<br>";
      attRy.forEach((a) =>{
        cnt.innerHTML += a + "<br>"
      })
      
      }
    else {
      cnt.innerHTML += 
      "wrong value of ID <br>";
    }
  }
}

<form action="">
  <table class="tg" id="tg">
    <tr>
      <td>Attribute name</td>
      <td><input type="text" id="value3"></td>
    </tr>
    <tr>
      <td>attribute value</td>
      <td><input type="text" id="value4"></td>
    </tr>
  </table>
  <div id="cnt"></div>
</form>
<div class="button">
  <button id='btn_javascript' onclick="javascript_click();">javascript</button>
</div>

Answer 2

希望我能正确理解你



    function javascript_click() {
  if (document.getElementById("value3").value && document.getElementById("value4").value) {
    var attName = document.getElementById("value3").value;
    var attValue = document.getElementById("value4").value;
    var value = "[" + attName + "=" + attValue + "]";
    var num2 = document.querySelectorAll(value).length;
    document.getElementById("cnt").innerHTML += "선택하신 노드는 " + num2 + "개 입니다. By javascript<br>";
  } else {
    document.getElementById("cnt").innerHTML += "wrong value of ID <br>";
  }
}
    <form action="">
  <table class="tg" id="tg">
    <tr>
      <td>Attribute name</td>
      <td><input type="text" id="value3"></td>
    </tr>
    <tr>
      <td>attribute value</td>
      <td><input type="text" id="value4"></td>
    </tr>
  </table>
  <div id="cnt"></div>
</form>
<div class="button">
  <button id='btn_javascript' onclick="javascript_click();">javascript</button>
</div>

如何计算用户在HTML中编写的属性名称和值的数量

2 个答案: