今天讲了js的组成部分中的第二组成部分(DOM),DOM包括以下内容:

window    -- 窗口
                                                   location -- 地址栏
                                                   history  -- 历史记录
                                                   document  --文档
                                                   statue      -- 任务栏

其中着重讲了document--文档
                                            1. 找到元素方法: 
                                                                  getElementById();       (“id名”)   得到一个
                                                                  getElementsByName();        (“name名”)是数组
                                                                  getElementsByClassName();            (“class名”)是数组
                                                                  getElementsByTagName();                   (标签名比如,div)是数组
                                           2.元素的属性             1)非表单元素内容属性:  innerHTML
                                                                             2)表单元素内容属性:     value

练习题

1  点击提示修改本身的值吗  弹窗接受输入的值  修改本元素内容

function three(){
var a=confirm("修改本身的值吗"),
b=prompt("输入的值");
document.getElementById("bb").innerHTML=b }
<button id="aa" onClick="three()">修改本身的值吗</button>

2

3个按钮  接受3个值  分别给他们赋值  for

function four(obj){

		for(var i=0;i<3;i++){
//obj.innerHTML=prompt("请输入一个值")
document.getElementsByName("aaa")[i].innerHTML=prompt("请输入一个数")
}
}
<button name="aaa" onClick="four(this)">点我</button> <button name="aaa" onClick="four(this)">快点</button>
<button name="aaa" onClick="four(this)">小不点</button>

3图片轮播

 var a=1;
function five(type){ document.getElementById("divimg").innerHTML='<img src="img/'+a+'.jpg">' if(type=='shang'){
a--;
if(a==0){
a=5
}
}
else{
a++;
if(a==5){
a=1
}
} } function one(val){ document.getElementById("divimg").innerHTML = '<img src="img/'+val+'.jpg">' }
}
<div id="divimg"><img src="img/1.jpg"></div> <button onClick="five('shang')">上一张</button>
<a onClick="one(1)" href="#">1</a>
<a onClick="one(2)" href="#">2</a>
<a onClick="one(3)" href="#">3</a>
<a onClick="one(4)" href="#">4</a>
<a onClick="one(5)" href="#">5</a>
<button onClick="five('xia')">下一张</button>

10.13DOM中document--文档1找到元素的方法,还有元素内容属性的更多相关文章

  1. 孤荷凌寒自学python第五十四天使用python来删除Firebase数据库中的文档

    孤荷凌寒自学python第五十四天使用python来删除Firebase数据库中的文档 (完整学习过程屏幕记录视频地址在文末) 今天继续研究Firebase数据库,利用google免费提供的这个数据库 ...

  2. 在SharePoint 2013 中使用文档库Scheduling (计划公布功能)

    本文讲述在SharePoint2013 中使用文档库Scheduling (计划公布功能)的步骤和注意的事项. 文档库Scheduling (计划公布功能) 用于设定当文档通过审批后特定的时间区间内才 ...

  3. MongoDB学习(操作集合中的文档)

    文档概念 文档的数据结构和JSON基本一样. 所有存储在集合中的数据都是BSON格式. BSON是一种类json的一种二进制形式的存储格式,简称Binary JSON. 插入文档 insert()方法 ...

  4. 操作Document文档

    利用客户端操作Document文档数据 1.创建一个文档(创建数据的过程,向表中去添加数据) 请求方式:Post 请求地址:es所在IP:9200/索引库/Type/文档ID(可给可不给,代表唯一标识 ...

  5. MongoDB(5)- Document 文档相关

    Documents MongoDB 的文档可以理解为关系型数据库(Mysql)的一行记录 MongoDB 将数据记录为 BSON 格式的文档 BSON 是 JSON 文档的二进制表示,但它支持的数据类 ...

  6. 从单一图像中提取文档图像:ICCV2019论文解读

    从单一图像中提取文档图像:ICCV2019论文解读 DewarpNet: Single-Image Document Unwarping With Stacked 3D and 2D Regressi ...

  7. MongoDB(10)- 查询嵌套文档

    插入测试数据 db.inventory.insertMany( [ { item: "journal", qty: 25, size: { h: 14, w: 21, uom: & ...

  8. Solr 18 - 通过SolrJ局部更新Solr中的文档 (原子操作、非覆盖操作)

    目录 1 需求分析 2 需求实现 2.1 pom.xml依赖 2.2 Java代码示例 3 补充说明 3.1 关于文档中_version_的取值说明 3.2 store=true/false的区别 1 ...

  9. Elasticsearch操作Document文档

    1.利用客户端操作Document文档数据        1.1 创建一个文档(创建数据的过程,向表中去添加数据)            请求方式:Post    请求地址:es所在IP:9200/索 ...

随机推荐

  1. 数据结构和算法之:二分法demo

    package com.js.ai.modules.pointwall.testxfz; class OrdArray{ private long[] a; private int nElems; p ...

  2. Linux 之 inotify+rsync 备份文件系统

    一.需求 1.线上有不同的机房,并且每个机房所对公网开放端口不一样. 2.A机房中的a机器是台文件服务器,需要备份到B机房中的b机器,以及C机房中的c机器. 3.并且保持实时同步.只要a上面的文件有改 ...

  3. supervisor+uwsgi+django遇到writing to a closed pipe/socket/fd解决

    原因: 最近开发的一个项目,由于有个更新job需要消耗的时间非常长,一度以为更新出现了错误. 经过: 于是打开debug模式测试, 异常开启,调试发现system返回了 writing to a cl ...

  4. Python添加模块

    参考博客:http://blog.csdn.net/damotiansheng/article/details/43916881 http://my.oschina.net/leejun2005/bl ...

  5. 千万别在UI线程上调用Control.Invoke和Control.BeginInvoke,因为这些是依然阻塞UI线程的,造成界面的假死

    原文地址:https://www.cnblogs.com/wangchuang/archive/2013/02/20/2918858.html .c# Invoke和BeginInvoke 区别 Co ...

  6. python开发_python中的module

    在python中,我们可以把一些功能模块化,就有一点类似于java中,把一些功能相关或者相同的代码放到一起,这样我们需要用的时候,就可以直接调用了 这样做的好处: 1,只要写好了一个功能模块,就可以在 ...

  7. C# 一维码生成

    概念 一维条码即指条码条和空的排列规则,常用的一维码的码制包括:EAN码.39码.交叉25码.UPC码.128码.93码,ISBN码,及Codabar(库德巴码)等. 条形码起源于 20 世纪 40 ...

  8. leetcode707

    数据结构的题,从网上找到的实现方式,先记录下来. class MyLinkedList { public: /** Initialize your data structure here. */ My ...

  9. 使用ExitProcess()结束本进程、TerminateProcess 结束进程

    进程只是提供了一段地址空间和内核对象,其运行时通过在其地址空间内的主线程来体现的.当主线程的进入点函数返回时,进程也就随之结束.这种进程的终止方式是进程的正常退出,进程中的所有线程资源都能够得到正确的 ...

  10. 4.Hadoop集群搭建之启动

    配置好Hadoop.HDFS.YARN.Zookeeper集群后,需要按照顺序启动. 前期准备 配置好Hadoop.HDFS.YARN.Zookeeper集群 先stop掉所有的hadoop服务 使用 ...