innerHTML、getElementsByName()、getElementsByTagName()

来源:互联网 发布:武汉网络中控机 编辑:程序博客网 时间:2024/05/20 17:26

innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML

返回id=tr2标签之间的元素

<html><head><script type="text/javascript">function getInnerHTML()  {  alert(document.getElementById("tr2").innerHTML);  }</script></head><body><table border="1"><tr id="tr1"><th>Firstname</th><th>Lastname</th></tr><tr id="tr2"><td>Peter</td><td>Griffin</td></tr></table><br /><input type="button" onclick="getInnerHTML()" value="Alert innerHTML of table row" /></body></html>

设置id=demo的元素值为My First JavaScript Function

<!DOCTYPE html><html><head><script>function myFunction(){document.getElementById("demo").innerHTML="My First JavaScript Function";}</script></head><body><h1>My Web Page</h1><p id="demo">A Paragraph</p><button type="button" onclick="myFunction()">Try it</button></body></html>

getElementsByName()方法按名字返回元素个数
getElementsByTagName() 方法按标签返回元素个数

getElementsByName()方法按名字input返回元素个数

<html><head><script type="text/javascript">function getElements()  {  var x=document.getElementsByName("Input");  alert(x.length);  }</script></head><body><input name="Input" type="text" size="20" /><br /><input name="myInput" type="text" size="20" /><br /><input name="myInput" type="text" size="20" /><br /><br /><input type="button" onclick="getElements()"value="How many elements named 'Input'?" /></body></html>

getElementsByTagName() 方法按标签input返回元素个数

<html><head><script type="text/javascript">function getElements()  {  var x=document.getElementsByTagName("input");  alert(x.length);  }</script></head><body><input name="myInput" type="text" size="20" /><br /><input name="myInput" type="text" size="20" /><br /><input name="myInput" type="text" size="20" /><br /><br /><input type="button" onclick="getElements()" value="How many input elements?" /></body></html>
0 0