當前位置：
首頁 >
前端技术
> javascript
>内容正文
javascript
javascript document对象 第21节
生活随笔
收集整理的這篇文章主要介紹了
javascript document对象 第21节
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
<html>
<head><title>DOM對象</title><style type="text/css">table {border:1px solid green;border-collapse:collapse;width:300px;}td {padding:5px;border:1px solid green;font-size:16px;text-align:center;}table#tab {border:1px solid green;border-collapse:collapse;width:128px;}#tab td {border:1px solid green;padding:1px;}#tab td img {border:0; }</style><script type="text/javascript">function showMsg(id) {var val = document.getElementById(id);//節點if(val.nodeName == "SPAN") {alert(val.innerHTML);// 文本使用innerHTMLval.innerHTML = "oracle";//可以取值 賦值} else {alert(val.value);//文本框使用value屬性取值val.value="李四";}}function checkAll(sta) {// alert(sta);var arr = document.getElementsByName("loves");//數組//alert(arr.length);//設置狀態for(var i = 0; i < arr.length; i++ ) {arr[i].checked = sta;}}</script> </head><body><div>DOM對象</div>1.document對象 getElementById() getElementsByName()<br/><script type="text/javascript">/*document.open();//打開流document.close();*/document.write("document.body : ", document.body.nodeName , "<br/>");document.write("document.cookie : ", document.cookie , "<br/>");document.write("document.domain : ", document.domain , "<br/>");document.write("document.lastModified : ", document.lastModified , "<br/>");document.write("document.referrer : ", document.referrer , "<br/>");document.write("document.title : ", document.title , "<br/>");document.write("document.URL : ", document.URL , "<br/>");/*document.writeln("document.URL : " );document.write("document.URL : " );*/</script><table><tr><td><span id="show">javascript</span></td></tr><tr><td><input type="text" name="username" id="username"/></td></tr><tr><td><input type="button" value="span" οnclick="showMsg('show')"/><input type="button" value="文本框" οnclick="showMsg('username')"/></td></tr><tr><td><input type="checkbox" name="control" οnclick="checkAll(this.checked)"/>全選/全不選</td></tr><tr><td><input type="checkbox" name="loves" value="足球"/>足球<input type="checkbox" name="loves" value="上網"/>上網<input type="checkbox" name="loves" value="旅游"/>旅游<input type="checkbox" name="loves" value="閱讀"/>閱讀</td></tr></table><br/>2.document對象 getElementsByTagName()<br/><script type="text/javascript">function randomImg() {var tab = document.getElementById("tab");//獲取表格//通過標記名獲取imgvar imgs = tab.getElementsByTagName("img");//alert(imgs.length);for(var i = 0; i < imgs.length; i++ ) {imgs[i].src = "ICONS/0" + ( Math.round( Math.random() * 84) + 11) + ".BMP"}}</script><table id="tab"><tr><td><img src="ICONS/011.BMP"/></td><td><img src="ICONS/011.BMP"/></td><td><img src="ICONS/011.BMP"/></td><td><img src="ICONS/011.BMP"/></td></tr><tr><td><img src="ICONS/011.BMP"/></td><td><img src="ICONS/011.BMP"/></td><td><img src="ICONS/011.BMP"/></td><td><img src="ICONS/011.BMP"/></td></tr><tr><td><img src="ICONS/011.BMP"/></td><td><img src="ICONS/011.BMP"/></td><td><img src="ICONS/011.BMP"/></td><td><img src="ICONS/011.BMP"/></td></tr><tr><td><img src="ICONS/011.BMP"/></td><td><img src="ICONS/011.BMP"/></td><td><img src="ICONS/011.BMP"/></td><td><img src="ICONS/011.BMP"/></td></tr></td></tr></table><br/><input type="button" value="打散" οnclick="randomImg()"/><br/>3.集合<br/><a href="http://www.baidu.com">百度</a><br/><a href="http://www.sina.com">新浪</a><br/><a href="http://www.taobao.com">淘寶</a><br/><form><input type="button" value="提交" /></form><form action="DOM對象操作.htm"><input type="button" value="提交" /></form><img src="p1.jpg"/><br/><img src="p2.jpg"/><br/><script type="text/javascript">document.write("document.links[1] .href : ", document.links[1] .href, "<br/>");document.write("document.forms[1] .action : ", document.forms[1] .action, "<br/>");document.write("document.images[17] .src : ", document.images[17] .src, "<br/>");function replaceCon() {document.links[1] .href = "http://www.163.com";document.forms[1] .action = "內置對象.htm";document.images[17] .src = "開發語言排行.jpg";alert(document.forms[1] .action);}</script><input type="button" value="替換" οnclick="replaceCon()" /></body>
</html>
?rs:
2.
轉載于:https://www.cnblogs.com/feilongblog/p/4744907.html
總結
以上是生活随笔為你收集整理的javascript document对象 第21节的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： Yii自定义验证规则
- 下一篇： 代码注释技术