今天讲了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. CC1,IceBreak,Hello world ,hello toastmaster

    this is my first speech:icebreak in toastmaster,it is precious memory for me,this is first time that ...

  2. microtip Tooltip工具提示样式

    最近开发项目,想增加滑动提示文字,类似img alt和i的title,但是效果都不是很理想,当然jq也有,但是用起来比较繁琐,使用不是特别方便 于是在github上看到了一个不错的库: https:/ ...

  3. C和指针 第三章--数据

    简要概述: <C和指针>第三章对数据进行了描述. 其中主要讲解了---变量的三个属性:作用域.链接属性和存储类型. 这三个属性决定了该变量在“什么地方可以使用”以及“该变量的值能够保持多久 ...

  4. iframe有哪些缺点?

    iframe会阻塞主页面的Onload事件:   iframe和主页面共享连接池,而浏览器对相同域的连接有限制,所以会影响页面的并行加载.使用iframe之前需要考虑这两个缺点.如果需要使用ifram ...

  5. 0CTF题中的神奇宝贝WP

    前言: 今天被尘少拉去做题 然后做到一个脑洞打开的题..... 神奇宝贝!?!? 正文: 一开始来到这=-= 弱密码猜测:admin admin 验证码用calc去算 然后成功进入 第一次去做神奇宝贝 ...

  6. Mysql本地服务器安装

    1.下载并解压 2.新建my.ini my.ini内容如下(路径填写自己的): ------------------------------------------------------------ ...

  7. mac 上sed

    mac上sed和liunx是不一样的,所以有些指令可能不通用,需要将mac上sed替换成gun的: Install Homebrew First, visit Homebrew homepage an ...

  8. Eclipse 常用插件地址大全

    安装方式: 使用Eclipse 的自动升级功能,菜单栏选[ Help ]→[ install new Software]  点击[Add]按钮,在“ Name ”中填入“ name (填写一个自己喜欢 ...

  9. 关于struts2.x中(警告: Could not find property [struts.valueStack])的解决方法

    出现“警告: Could not find property [struts.valueStack]”这样的问题,是由于少引用了log4j.jar包,不过,不引用也不影响使用.看个人的爱好了.

  10. DM368 NAND Flash启动

    概要: 本文介绍了DM368 NAND Flash启动的原理,并且以DM368  IPNC参考设计软件为例,介绍软件是如何配合硬件实现启动的. 芯片上电后是如何启动实现应用功能的?这是许多工程师在看到 ...