XML DOM チュートリアルlogin
XML DOM チュートリアル
著者:php.cn  更新時間:2022-04-13 15:27:56

DOM変更ノード


XML DOM ノード値の変更


nodeValue 属性は、ノード値を変更するために使用されます。

setAttribute()メソッドは属性値を変更するために使用されます。



tryitimg.gif試してみる - 例

以下の例では、XML ファイル Books.xml を使用します。
外部 JavaScript にある関数loadXMLDoc()は、XML ファイルをロードするために使用されます。

要素のテキスト ノードを変更する
この例では、nodeValue 属性を使用して、「books.xml」の最初の 要素のテキスト ノードを変更します。 </p><p>setAttribute を使用して属性値を変更する<br/>この例では、setAttribute() メソッドを使用して、最初の <book> の「category」属性の値を変更します。 </p><p>nodeValue を使用して属性値を変更する<br/>この例では、nodeValue 属性を使用して、最初の <book> の「category」属性の値を変更します。 </p><hr/><h2>要素の値を変更する</h2><p> DOM では、各コンポーネントはノードです。要素ノードにはテキスト値がありません。 </p><p>要素ノードのテキストは子ノードに格納されます。このノードをテキストノードと呼びます。 </p><p>要素のテキストを変更する方法は、この子ノード(テキストノード)の値を変更することです。 </p><hr/><h2>テキスト ノードの値を変更する</h2><p>nodeValue プロパティを使用して、テキスト ノードの値を変更できます。 </p><p>次のコード スニペットは、最初の <title> 要素のテキスト ノードの値を変更します: </p><div class="example"><h2 class="example">例</h2><div class="example_code"><pre class="brush:html;toolbar:false"><!DOCTYPE html> <html> <head> <script src="loadxmldoc.js">  </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("title")[0].childNodes[0]; x.nodeValue="Easy Cooking"; document.write(x.nodeValue); </script> </body> </html></pre></div><br/><a target="_blank" href="#" class="showbtn codebtn">サンプルの実行»</a><p>オンラインのサンプルを表示するには、[サンプルの実行] ボタンをクリックします</p></div><p>インスタンスの説明: </p><ol class=" list-paddingleft-2"><li><p>loadXMLDoc()を使用して「books.xml」をxmlDocにロードします</p></li><li><p>最初の<title>要素のテキストノードを取得します</p></li><li><p>テキストノードのノード値を「」に変更します簡単クッキング</p></li></ol><p>すべての <title> 要素のテキスト ノードをループして変更します: 試してみてください<br/></p><hr/><h2>属性の値を変更してください</h2><p> DOM では、属性もノードです。要素ノードとは異なり、属性ノードにはテキスト値があります。 I</p><p>属性の値を変更する方法は、そのテキスト値を変更することです。 </p><p>これは、setAttribute() メソッドまたは属性ノードの nodeValue 属性を使用して実現できます。 </p><hr/><h2> setAttribute() </h2><p>setAttribute() メソッドを使用して属性を変更し、既存の属性の値を変更するか、新しい属性を作成します。 </p><p>次のコードは、<book> 要素の category 属性を変更します: </p><div class="example"><h2 class="example">Instance</h2><div class="example_code"><pre class="brush:html;toolbar:false"><!DOCTYPE html> <html> <head> <script src="loadxmldoc.js">  </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName('book'); x[0].setAttribute("category","food"); document.write(x[0].getAttribute("category")); </script> </body> </html></pre></div><br/><a target="_blank" href="#" class="showbtn codebtn">インスタンスの実行 »</a><p>オンライン インスタンスを表示するには、[インスタンスの実行] ボタンをクリックします</p></div><p>例の説明: </p><ol class=" list-paddingleft-2"><li><p>loadXMLDoc()を使用して「books.xml」をxmlDocにロードします</p></li><li><p>最初の<book>要素を取得します</p></li><li><p>「category」属性の値を「food」に変更します"</p></li></ol><p>すべての <title> 要素をループして、新しい属性を追加します。試してみてください </p><p><strong>注: </strong>属性が存在しない場合は、(指定された名前と値で) 新しい属性を作成します。 <br/></p><hr/><h2>nodeValue を使用して属性を変更する</h2><p>nodeValue 属性を使用して属性ノードの値を変更できます: </p><div class="example"><h2 class="example">例</h2><div class="example_code"><pre class="brush:html;toolbar:false"><!DOCTYPE html> <html> <head> <script src="loadxmldoc.js">  </script> </head> <body> <script> xmlDoc=loadXMLDoc("books.xml"); x=xmlDoc.getElementsByTagName("book")[0] y=x.getAttributeNode("category"); y.nodeValue="food"; document.write(y.nodeValue); </script> </body> </html></pre></div><br/><a target="_blank" href="#" class="showbtn codebtn">インスタンスの実行»</a><p>オンラインで表示するには、[インスタンスの実行] ボタンをクリックします。例</p></div><p>インスタンスの説明: </p><ol class=" list-paddingleft-2"><li><p>loadXMLDoc()を使用して、「books.xml」をxmlDocにロードします</p></li><li><p>最初の<book>要素の「category」属性を取得します</p></li><li><p>の値を変更します属性ノードを「食べ物」にします</p></li></ol><br/></div></div></div></div><div class="previous-next-links"><div class="previous-design-link">← <a href="/xml/xml-nodes-get.html" rel="prev">DOM 取得ノード</a></div><div class="next-design-link"><a href="/xml/xml-nodes-remove.html" rel="next">DOM 削除ノード</a> →</div></div><div class="sidebar-box ad-box ad-box-large"><div class="ad-336280"></div></div></div></div></div></div><div id="codeMark"></div><div id="codeMain"><div class="left"><div id="codeEditor"></div><div class="editor-btn"><div class="editor-btn-inner"><a href="javascript:;" class="code-btn-submit r" id="J_Commit" title="提出する">提出する</a></div></div></div><div class="right"><div id="codeResult"></div></div><div id="close"></div></div><script src="/static/js/CodeRunOnline.js?1.1"></script><script src="/static/src-min-noconflict/ace.js"></script><footer><a href='https://m.php.cn/ja/' ><i class='layui-icon layui-icon-home '></i>ホームページ</a><a href='/course.html' ><i class='layui-icon layui-icon-play'></i>動画</a><a href="https://m.php.cn/ja/wenda.html" ><i class='layui-icon layui-icon-code-circle'></i>に質問</a><a href='https://m.php.cn/ja/login' ><i class='layui-icon layui-icon-username'></i>私の</a></footer><div class="right_menu"><div class="right_menu_con"><h2 class="hjclass-txt"><i class="layui-icon layui-icon-shrink-right hjclass-txt-i"></i>PHP中国語ウェブサイト</h2><div class="menu-list"><a href="https://m.php.cn/ja/"><span class="item-icon item-1"><img src="https://img.php.cn/upload/article/000/000/003/5bffb65f99ae2304.png" alt="ホームページ"></span>ホームページ</a><a href="https://m.php.cn/ja/course.html"><span class="item-icon item-7"><img src="https://img.php.cn/upload/article/000/000/003/5bffb82bd09ad628.png" alt="コース"></span>コース</a><a href="https://m.php.cn/ja/article.html"><span class="item-icon item-4"><img src="https://img.php.cn/upload/article/000/000/003/5bffb7e111b3b425.png" alt="記事"></i></span>記事</a><a href="https://m.php.cn/ja/wenda.html"><span class="item-icon item-2"><img src="https://img.php.cn/upload/article/000/000/003/5bffb83f04e24328.png" alt="に質問"></span>に質問</a><a href="https://m.php.cn/ja/dic.html"><span class="item-icon item-9"><img src="https://img.php.cn/upload/article/000/000/003/5bffb85047b25758.png" alt="辞書"></span>辞書</a><a href="https://m.php.cn/ja/course/type/99.html"><span class="item-icon item-3"><img src="https://img.php.cn/upload/article/000/000/003/5bffb8736ea90300.png" alt="マニュアル"></span>マニュアル</a><a href="https://m.php.cn/ja/xiazai/"><span class="item-icon item-5"><img src="/static/images/ico/resources.png" alt="ダウンロード"></span>ダウンロード</a><a href="https://m.php.cn/ja/search"><span class="item-icon item-6"><img src="https://img.php.cn/upload/article/000/000/003/5bffb880b460a204.png" alt="検索"></span>検索</a><a href="https://m.php.cn/ja/app/"><span class="item-icon item-6"><img src="https://img.php.cn/upload/article/000/000/003/608bbfa30d9cc398.png" style="width:35px;height:35px;" alt="APPダウンロード"></span> APPダウンロード</a></div></div></div><script>isLogin = 0;</script><script type="text/javascript" src="/static/js/jquery.min.js"></script><script type="text/javascript" src="/static/layui/layui.js"></script><script type="text/javascript" src="/static/js/global.js?4.9.47"></script><script>(function () { var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?43f47cabf6856204df6d083dd89ae407"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script></body></html>