<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title></title>

    </head>

    <body>

        <div id=""one"></div>

        <input type="text" name="two" id="two" value="123" />

        // name = value

        <ul>

            <li></li>

            <li></li>

            <li></li>

            <li></li>

            <li></li>

        </ul>

        <div class="four"></div>

        <div class="four"></div>

        <div class="four"></div>

        <div class="four"></div>

        <div class="four"></div>

        <div id="five">

            今天晴天

        </div>

        <table border="1" cellspacing="0" cellpadding="0">

        </table>

    </body>

</html>

<script type="text/javascript">

//           找到dom元素

//document   文档

//get 拿到 得到

//element  元素

// by 通过

//通过id名找到元素

var one = document.getElementById("one");

//通过name属性 找到元素

var two = document.getElementsByName("two");

//通过标签名找到元素 HTMLCollection  集合

 var three = document.getElementsByTagName("li");

 //console.log(three[0])

 // 0: <li>

  //  1: <li>

   // 2: <li>

    //3: <li>

 //   4: <li>

  //  length:5

   var four = document.getElementsByClassName("four");

   //              操作dom元素

   //一：操作内容

   var five = document.getElementById("five");

   //1、five.innerHTML = "今天<br/>阴天"

   //2、five.innerText = "今天<br/>阴天"

   //打印表格  练习

   var tab = document.getElementsByTagName("table");

   var str = ""

   for(var i = 0;i < 3;i++){

       str = str+"<tr>"

       for(var j = 0;j<3;++){

           str = str + "<td>周一</td>"

       }

       str = str + "</tr>"

   }

   tab[0].innerHTML = str;

   //3、操作表单的value

   var inpt = document.getElementById("two")

   alert(inpt.value);

</script>

JA document的练习的更多相关文章

  1. PC京东登录页分析 curl

    w 正确的组合,没有显示新页面的数据. <!doctype html> <html> <head> </head> <?php include(' ...

  2. document.documentElement.clientHeight 与 document.body.clientHeight(杜绝千篇一律的抄袭!!)

    document.documentElement.clientHeight 与 document.body.clientHeight用来获取页面可视高度我觉得有点问题.这两个应该不是一个东西. 页面中 ...

  3. jquery中的$(document).ready(function() {});

    当文档载入时执行function函数里的代码, 这部分代码主要声明,页面加载后 "监听事件" 的方法.例如: $(document).ready( $("a") ...

  4. document.compatMode

    在我电脑屏幕上显示的 电脑是 1920*1080这是在document.compatMode:css1Compat模式 window.screen.availWidth 1920 window.scr ...

  5. 谈谈document.ready和window.onload的区别

    在Jquery里面,我们可以看到两种写法:$(function(){}) 和$(document).ready(function(){}) 这两个方法的效果都是一样的,都是在dom文档树加载完之后执行 ...

  6. Windows.document

    一.找到元素: document.getElementById("id");根据id找,最多找一个 var a =document.getElementById("id& ...

  7. Error on line -1 of document : Premature end of file. Nested exception: Premature end of file.

    启动tomcat, 出现, ( 之前都是好好的... ) [lk ] ERROR [08-12 15:10:02] [main] org.springframework.web.context.Con ...

  8. JavaScript权威设计--JavaScript脚本化文档Document与CSS(简要学习笔记十五)

    1.Document与Element和TEXT是Node的子类. Document:树形的根部节点 Element:HTML元素的节点 TEXT:文本节点   >>HtmlElement与 ...

  9. $(document).ready() 与window.onload的区别

    1.执行时间 window.onload必须等到页面内包括图片的所有元素加载完毕后才能执行. $(document).ready()是DOM结构绘制完毕后就执行,不必等到加载完毕. 2.编写个数不同 ...

随机推荐

  1. Beautifulsoup提取特定丁香园帖子回复

    DataWhale-Task3(Beautifulsoup爬取丁香园) 简要分析 完整代码 结果图 参考资料 简要分析 任务3:爬取丁香园论坛特定帖子,包括帖子主题,帖子介绍,回贴内容(用户名,用户头 ...

  2. 【ACM】nyoj_2_括号配对问题_201308091548

    括号配对问题时间限制:3000 ms  |  内存限制:65535 KB 难度:3描述 现在,有一行括号序列,请你检查这行括号是否配对. 输入 第一行输入一个数N(0<N<=100),表示 ...

  3. 【ACM】hdu_zs2_1003_Problem C_201308031012

    Problem C Time Limit : 2000/1000ms (Java/Other)   Memory Limit : 65536/32768K (Java/Other)Total Subm ...

  4. [bzoj3717][PA2014]Pakowanie_动态规划_状压dp

    Pakowanie bzoj-3717 PA-2014 题目大意:给你n个物品m个包,物品有体积包有容量,问装下这些物品最少用几个包. 注释:$1\le n\le 24$,$1\le m\le 100 ...

  5. [MGR——Mysql的组复制之单主模式 ]详细搭建部署过程

    1,关于MySQL Group Replication   基于组的复制(Group-basedReplication)是一种被使用在容错系统中的技术.Replication-group(复制组)是由 ...

  6. Dockerfile分离构建LNMP环境部署wordpress

    最近忙着写自己的项目,也把一个站点的bbs论坛打算迁移到Docker中,测试没发现啥大问题.在单台上面的架构如下:(往后我们也是要讲到compose和swarm调度的慢慢来) 1.首先我们先安装一下d ...

  7. 3D语音天气球（源代码分享）——通过天气服务动态创建3D球

    转载请注明本文出自大苞米的博客(http://blog.csdn.net/a396901990),谢谢支持! 开篇废话: 这个项目准备分四部分介绍: 一:创建可旋转的"3D球":3 ...

  8. APP漏洞自动化扫描专业评测报告（中篇）

    前言 上一篇中通过对阿里聚安全[1].360App漏洞扫描[2].腾讯金刚审计系统[3].百度移动云测试中心[4]以及AppRisk Scanner[5] 在收费情况.样本测试后的扫描时间对比和漏洞项 ...

  9. 【cocos2d-x 3.7 飞机大战】 决战南海I (八) 背景移动

    採用双层背景.这样效果更好 .h class BackgroundMove : public Layer { public: BackgroundMove(); ~BackgroundMove(); ...

  10. MongoDB 索引的使用, 管理 和优化

    MongoDB 索引的使用, 管理 和优化 2014-03-25 17:12 6479人阅读 评论(0) 收藏 举报  分类: MongoDB(9)  [使用explain和hint] 前面讲高级查询 ...