Chinaunix首页 | 论坛 | 博客

CrowTLFcrowtlf.blog.chinaunix.net

首页　| 　博文目录　| 　关于我

crowtlf

  • 博客访问： 243197
  • 博文数量： 108
  • 博客积分： 3045
  • 博客等级： 中校
  • 技术积分： 1162
  • 用 户 组： 普通用户
  • 注册时间： 2007-04-19 18:26
文章分类

全部博文（108）

推荐博文
js_dom_1

分类： JavaScript

2013-11-26 17:18:58


点击(此处)折叠或打开

  1. <script>
  2.     /*
  3.     1.DOM
  4.     Documnet Object Model
  5.         a.document文档 html xml文件
  6.         标记语言
  7.         
  8.         b.object 对象 html的元素转成的js对象
  9.         如果使用js操作html,就需要先将HTML文档结构转成js对象
  10.             I.操作属性
  11.             II.操作内容
  12.                 innerText(IE) textContent(FF)
  13.                 innerHTML
  14.                 ouertText
  15.                 outerHtml

  17.                 表单
  18.                     value取值
  19.             III.操作样式
  20.                 aobj.style.backgroundColor="red";
  21.                 aobj.style.fontSize="3cm";
  22.                 className

  24.                 aobj.className="test";
  25.                 aobj.className+=" demo";
  26.                 aobj.className="";
  27.     
  28.             有了以上三点的操作之前先转成对象.
  29.         转成对象的两种形式:
  30.         I.标记名(多个).id(唯一).name(多个).
  31.             document中的三个方法
  32.             1>var objs=document.getElementsByTagName("div");
  33.             2>var objs=document.getElementById("one");
  34.             3>var objs=document.getElementsByName("two");
  35.     2.BOM
  36.     */
  37. </script>

  39. <html>
  40. <head>
  41.     <meta http-equiv="content-type" content="text/html; charset=utf-8">

  43.     <title>Text</title>
  44.     <style>
  45.         #alink{
  46.             width:400px;
  47.         }
  48.         .text{
  49.             width:500px;
  50.             height:500px;
  51.             border:5px solid blue;
  52.             font-size:4cm;
  53.             color:red;
  54.             background:yellow;
  55.         }
  56.     </style>
  57. </head>
  58. <body>
  59.     <div>
  60.     </div>
  61.     <div id="one">
  62.         
  63.     </div>
  64.     <div id="two">
  65.         
  66.     </div>
  67. <input id="username" type="text" name="username" value="zhangsan"><br>

  69. <a id="alink" href="" target="_blank" title="this is test"><b>test</b></a>
  70. <textarea id="username1" name="Name" rows="8" cols="40">ddddddddddd</textarea></br>

  72. <script type="text/javascript" charset="utf-8">
  73.     var aobj=document.getElementById("alink");
  74.     //'-'去掉,后面的单词,首字母大写
  75.     aobj.style.backgroundColor="red";
  76.     aobj.style.fontSize="3cm";
  77.     aobj.className="text";
  78. //    alert(aobj.style.width);
  79. //    alert(aobj.offsetWidth);


  82. /*        var username1=document.getElementById("username1");
  83.         alert(username1.value);
  84. */
  85. /*        var aobj=document.getElementById("alink");
  86.         aobj.href="";
  87.         aobj.target="_self";
  88.         aobj.title="demo demo";
  89. */
  90. //        alert(aobj.outerHTML);
  91. //        aobj.innerText="brother";
  92. //        aobj.innerHTML="

    aaaaaa

    "

  94. //        alert(aobj.innerText);
  95. //        alert(aobj.innerHTML);

  97. //        aobj.textContent="brophp";
  98.             
  99. /*        ffie(aobj,"wwwwwww");
  100.         alert(ffie(aobj));

  102.         function ffie(obj,value){
  103.         
  104.             if(document.all){
  105.                 if(typeof(value)=="undefined")
  106.                     return obj.innerText;
  107.                 else
  108.                     return obj.innerText=value;
  109.                 //alert("IE");
  110.             }else{
  111.                 
  112.                 if(typeof(value)=="undefined")
  113.                     return obj.textContent;
  114.                 else
  115.                     return obj.textContent=value;
  116.                 //alert("FF");
  117.             }
  118.         }*/
  119.     </script>
  120. </body>
  121. </html>


点击(此处)折叠或打开

  1. var aobj=document.getElementById("alink");
  2.     var pro="";
  3.     for (pro in aobj){
  4.         document.write("a."+pro+"="+aobj[pro]+"
    "    )
  5.     }

阅读(446) | 评论(0) | 转发(0) |
0

上一篇：js_array

下一篇：vim 自用命令

给主人留下些什么吧！~~
关于我们 | 关于IT168 | 联系方式 | 广告合作 | 法律声明 | 免费注册

Copyright 2001-2010 ChinaUnix.net All Rights Reserved 北京皓辰网域网络信息技术有限公司. 版权所有

感谢所有关心和支持过ChinaUnix的朋友们

16024965号-6