<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);// 文本使用innerHTML
val.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" onclick="showMsg('show')"/>
<input type="button" value="文本框" onclick="showMsg('username')"/></td></tr> <tr><td><input type="checkbox" name="control" onclick="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");//获取表格
//通过标记名获取img
var 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="打散" onclick="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="替换" onclick="replaceCon()" /> </body>
</html>

rs:

2.

javascript document对象 第21节的更多相关文章

  1. javaScript document对象详解

    Document对象内容集合 document 文挡对象 - JavaScript脚本语言描述———————————————————————注:页面上元素name属性和JavaScript引用的名称必 ...

  2. javascript BOM对象 第15节

    <html> <head> <title>浏览器对象</title> <script type="text/javascript&quo ...

  3. 详解JavaScript Document对象

    转自:http://segmentfault.com/a/1190000000660947 在浏览器中,与用户进行数据交换都是通过客户端的javascript代码来实现的,而完成这些交互工作大多数是d ...

  4. 浅尝JavaScript document对象

    document对象 每个载入浏览器的 HTML 文档都会成为 Document 对象.document 对象是HTML文档的根节点与所有其他节点(元素节点,文本节点,属性节点, 注释节点).Docu ...

  5. JavaScript document对象

    1.document对象是window对象的子对象,可直接使用,多用于获取HTML页面元素 2.document对象属性 a) alinkColor活动链接颜色 b) linkColor文本链接颜色 ...

  6. javascript Window对象 第16节

    <html> <head> <title>浏览器对象</title> <script type="text/javascript&quo ...

  7. 14 JavaScript Window对象

    Window对象表示一个浏览器窗口或者一个框架. 在客户端JavaScript中,window对象是全局对象,所有的表达式都在当前的环境中计算. Window对象的子对象: JavaScript do ...

  8. javascript获取iframe框架中页面document对象,获取子页面里面的内容,iframe获取父页面的元素,

    javascript获取iframe框架中,加载的页面document对象 因为浏览器安全限制,对跨域访问的页面,其document对象无法读取.设置属性 function getDocument(i ...

  9. 第一百二十节,JavaScript事件对象

    JavaScript事件对象 学习要点: 1.事件对象 2.鼠标事件 3.键盘事件 4.W3C与IE JavaScript事件的一个重要方面是它们拥有一些相对一致的特点,可以给你的开发提供更多的强大功 ...

随机推荐

  1. bzoj 2285 [Sdoi2011]保密(二分,spfa + 最大流)

    Description 现在,保密成为一个很重要也很困难的问题.如果没有做好,后果是严重的.比如,有个人没有自己去修电脑,又没有拆硬盘,后来的事大家都知道了. 当然,对保密最需求的当然是军方,其次才是 ...

  2. 《Introduction to Algorithm》-chaper30-多项式与快速傅里叶变换

    两个n次多项式的相加最直接的方法所需要的时间是O(n),而实现两个n次多项式的乘法的直接方法则需要O(n^2),本章讨论的快速傅里叶变换(FFT),将会将这一过程的时间复杂度降至O(nlogn).同时 ...

  3. 委托demo

    delegate bool Filter(string s); class test { static void Main() { Filter f=new Filter(A); Display(ne ...

  4. 后台JOB&EVENT JOB

    SM35执行一个后台作业后,想及时停止, 运行SM37后,点击ctr + F1停止活动的作业,系统根本就没反应. 解决方法: 第一步:SM50, 找到,Ty.列为BGD的(Background),然后 ...

  5. HDU 2517 棋盘分割

    题意:n刀切割棋盘 下面是8*8的棋盘,每个数字代表棋盘对应点的权值,问切割n刀后,每一块的和  的均方差最小是多少 均方差的公式需要先化简: 由上式得,均方差最小 显然是要 Xi^2 最小 d[k] ...

  6. mybatis generator 使用

    国内私募机构九鼎控股打造APP,来就送 20元现金领取地址:http://jdb.jiudingcapital.com/phone.html内部邀请码:C8E245J (不写邀请码,没有现金送)国内私 ...

  7. time_t和struct tm之间的转换

    time_t到struct tm的转换: #include <time.h> struct tm *localtime(const time_t *timep); struct tm到ti ...

  8. [Javascript] Ex: concatAll, map and filter

    concatAll: Array.prototype.concatAll = function() { var results = []; this.forEach(function(subArray ...

  9. 单核CPU,多线程与性能

      问题概述 单核CPU的计算机上, 多线程能够提高程序运行的性能吗? 这个问题看起来简单,实际很复杂,设计到多方面的因素. 首先我们要把概念搞清楚, 那就是什么是性能? 一般来说, 我们把运行一个任 ...

  10. linux 配置 Apache mysql php最新版

    第一部分:安装mysql 官方下载 mysql5.6.19 64位的rpm格式文件 0.rpm 四个mysql5.6.19 卸载默认的mysql yum -y remove mysql-libs-* ...