getElementById返回拥有指定id的第一个对象(注意只是一个且是第一个)getElementsByName返回带有指定名称的对象集合getElementsBytagNam返回指定标签的对象集合

例html代码<div class="content"   >
    <div class="logo">        <img src="data:images/dd_logo.jpg"><span>关闭</span>    </div>    <div class="cartList">            <ul>            <li>¥<input type="text" name="price" value="21.90"></li>            <li><input type="button" name="minus" value="-" οnclick=" mins(0)"><input type="text" name="amount" value="1"><input type="button" name="plus" value="+" οnclick="add(0)"></li>            <li id="price0">¥21.90</li>            <li><p>移入收藏</p><p>删除</p></li>        </ul>        <ul>            <li>¥<input type="text" name="price" value="24.00"></li>            <li><input type="button" name="minus" value="-" οnclick="mins(1)"><input type="text" name="amount" value="1"><input type="button" name="plus" value="+"οnclick="add(1)"></li>            <li id="price1">¥24.00</li>            <li><p>移入收藏</p><p>删除</p></li>        </ul>        <ol>            <li id="totalPrice"  οnclick="total()" >&nbsp;</li>            <li><span>结 算</span></li>        </ol>    </div></div>
JavaScrip代码function total(){    //得到2个商品价格的集合    var prices = document.getElementsByName("price");    //得到2个数量的集合    var count = document.getElementsByName("amount");    //初始总价    var sum = 0;    //    for(var i=0;i<prices.length;i++){

        sum+=prices[i].value*count[i].value;    }    //最终直接赋值    document.getElementById("totalPrice").innerHTML="¥"+sum;

history 和 location对象 location.href返回或者设置完整url例:<a href="javascript:location.href='spring.html'">春天</a>点击‘春天’ 可以跳转到指定的页面   spring.html
history对象的方法back(),forward(),go()等
例<a href="javascript:history.go(-1)">后退</a> <a href="javascript:history.go(1)">前进</a></td>点击‘后退’时进行 页面后退,后退到上一个页面 ,前进也是一样 back()后退,forward()前进,作用与go()一样 (记不住就记 go()方法就行了注意使用时javascript:不能省略

confirm对话框  弹出确定,取消的对话框;   prompt输入对话框,alert提示对话框(这俩个就不介绍了)例function del_plan(){
    var flag =confirm("确定要删除吗");    if(flag==true){         alert("删除成功");    }}上述代码点击对话框 确定 按钮之后弹出‘删除成功’,相对flase也是相似的代码

例function disptime(){    var today =new Date();
  var today =new Date();  //年  var year=today.getFullYear();  //月返回0-11  var month=today.getMonth();  //0-6返回星期几 0是星期日  var day=today.getDay();
  if(day==0){      day ="日";  }
  //日1-31  var date=today.getDate();
  //时    var  hh =today.getHours();  //分    var mm =today.getMinutes();  //秒    var ss =today.getSeconds();

    document.getElementById("myTime").innerHTML="现在是:"+hh+":"+mm+":"+ss;}

//进行刷新控制 每一秒进行刷新var  myTimes =setInterval("disptime()",1000);


转载于:https://www.cnblogs.com/bincounste/p/10053984.html

JavaScript操作BOM对象 - document对象; history 和 location对象 ,对话框,Date时间对象...相关推荐

  1. pandas使用to_datetime函数将时间字符串转化为时间对象、使用dt.tz_localize为转化后的时间对象添加时区信息(timezone)

    pandas使用to_datetime函数将时间字符串转化为时间对象.使用dt.tz_localize为转化后的时间对象添加时区信息(timezone) 目录 pandas使用to_datetime函 ...

  2. JavaScript基础——第二章,JavaScript操作BOM对象

    一,BOM模型(Borwser Object Model) BOM提供了独立内容的,可以与浏览器窗口进行互动的对象结构 BOM可实现功能: 弹出新的浏览器窗口 移动,关闭浏览器窗口以及调整窗口的大小 ...

  3. JavaScript操作BOM对象

    window对象 浏览器对象模型(BOM)是JavaScript的组成之一 ,它提供了独立于内容与浏览器窗口进行交互的对象,使用浏览器对象模型可以实现与HTML的交互.它的作用是将相关的元素组织包装起 ...

  4. JavaScript学习笔记2——JavaScript操作BOM对象

    BOM模型 BOM:浏览器对象模型(Browser Object Model) BOM提供了独立于内容的.可以与浏览器窗口进行互动的对象结构 BOM可实现功能 弹出新的浏览器窗口 移动.关闭浏览器窗口 ...

  5. javascript基础——window对象(screen、history、location、navigator、window对象常用方法、window对象常用事件)

    1.screen window.screen 对象包含有关用户屏幕的信息 screen.availWidth 屏幕宽度 screen.availHeight  屏幕高度 2.history forwa ...

  6. JavaScript操作BOM简单案例

    需要两个页面index.html和Test.html,可以直接运行,每个功能都已经注释完整,index.html页面的代码: <!DOCTYPE html> <html>< ...

  7. 【前端开发—JavaScript】——BOM/DOM

    Bom Browser Object Model 浏览器 对象 模型 浏览器对象模型: 浏览器提供的一系列可以操作浏览器API BOM中的顶级对象 window (全局中的window) + 使用BO ...

  8. Python3 时间字符串与时间对象之间的转换等

    1.时间对象转字符串 date = datetime.datetime.strptime('2021-12-31', '%Y-%m-%d') #字符串转时间对象 _u = datetime.timed ...

  9. 有关window的history和location的使用

    history 有关客户访问过的 URL 信息 location 有关当前的URL信息 location的属性: 属性 描述 closed 返回窗口是否已被关闭. defaultStatus 设置或返 ...

最新文章

  1. mysql数据库映射到内存_基于共享内存的数据库映射
  2. Google 图片搜索的原理是什么?
  3. 基于虎书实现LALR(1)分析并生成GLSL编译器前端代码(C#)
  4. VTK修炼之道36:图像平滑_均值滤波器
  5. java内部类为什么会持有外部类的引用_为什么内部类持有外部类的引?
  6. 为什么我们从Angular 2迁移到Vue.js(为什么我们没有选择React)
  7. Nmap中文手册浅析
  8. CRM_REPORT_RF_AUTH_OBJ_ORD_PR
  9. 互联网智商测试:搜索引擎谁的“智商”更高?
  10. 虚拟机 无法 ftp服务器系统,访问不到虚拟机上的ftp服务器上
  11. 二维码获取WIFI配置
  12. 程序员常用资源工具集合(建议收藏)
  13. C语言四分位数Quartile算法(附完整源码)
  14. 一种简单的色彩平衡算法的OPENCV实现
  15. 【pandas】教程:1-处理什么样的数据
  16. 基于SSM二手交易平台
  17. I - ICPC Awards(字符串)
  18. 蓝桥杯_既约分数_java
  19. display:Wayland Architecture
  20. 安装 Cloudera Manager、CDH、KUDU 随手记

热门文章

  1. linux服务器禁ip策略,Linux服务器自动封禁访问异常的IP脚本(一)
  2. C语言读取大文件的问题 内存映射
  3. Go语言中命令行参数的实现
  4. servlet container:tomcat jetty and undertow
  5. 研发全球化再升级,华为已悄然布局16家海外研究所
  6. 【MySQL】mysql死锁以及死锁日志分析
  7. CentOS 6.5装配第三方软件库epel
  8. 使用 ssmtp 於 shell 透過 Gmail 寄信
  9. 计算Linux内存,CUP,硬盘使用率的shell脚本
  10. 动态ACL+自反ACL