Document.getElementsByTagNameNS()

åºçº¿ å¹¿æ³å¯ç¨

è¯æ³

getElementsByTagNameNS(namespace, name)

åæ°

namespace: æè¦æ¥è¯¢çåç´ çå½åç©ºé´ URLï¼åè§ element.namespaceURIï¼ã
name: æè¦æ¥è¯¢çåç´ çåç§°æç¹æ®å¼ *ï¼ä»£è¡¨ææåç´ ï¼åè§ element.localNameï¼ã

å¤æ³¨ï¼ä¸ document.getElementsByTagName() ä¸åï¼getElementsByTagNameNS() çåæ°æ¯å¤§å°åææçã

è¿åå¼

ç¤ºä¾

æ³¨æå½è°ç¨getElementsByTagNameæ¹æ³è·åå°çèç¹ä¸æ¯ææ¡£èç¹æ¶ï¼å®éä¸æ¯è°ç¨äºelement.getElementsByTagNameNSæ¹æ³ã

html

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title>getElementsByTagNameNS example</title>

    <script type="text/javascript">
      function getAllParaElems() {
        var allParas = document.getElementsByTagNameNS(
          "http://www.w3.org/1999/xhtml",
          "p",
        );

        var num = allParas.length;

        alert("There are " + num + " &lt;p&gt; elements in this document");
      }

      function div1ParaElems() {
        var div1 = document.getElementById("div1");
        var div1Paras = div1.getElementsByTagNameNS(
          "http://www.w3.org/1999/xhtml",
          "p",
        );

        var num = div1Paras.length;

        alert("There are " + num + " &lt;p&gt; elements in div1 element");
      }

      function div2ParaElems() {
        var div2 = document.getElementById("div2");
        var div2Paras = div2.getElementsByTagNameNS(
          "http://www.w3.org/1999/xhtml",
          "p",
        );

        var num = div2Paras.length;

        alert("There are " + num + " &lt;p&gt; elements in div2 element");
      }
    </script>
  </head>

  <body style="border: solid green 3px">
    <p>Some outer text</p>
    <p>Some outer text</p>

    <div id="div1" style="border: solid blue 3px">
      <p>Some div1 text</p>
      <p>Some div1 text</p>
      <p>Some div1 text</p>

      <div id="div2" style="border: solid red 3px">
        <p>Some div2 text</p>
        <p>Some div2 text</p>
      </div>
    </div>

    <p>Some outer text</p>
    <p>Some outer text</p>

    <button onclick="getAllParaElems();">show all p elements in document</button
    ><br />

    <button onclick="div1ParaElems();">
      show all p elements in div1 element</button
    ><br />

    <button onclick="div2ParaElems();">
      show all p elements in div2 element
    </button>
  </body>
</html>