js加减运算·传参
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style>
body {
font-family: "微软雅黑";
}
em {
font-style: normal;
}
ul li {
list-style: none;
margin-bottom: 5px;
}
</style>
</head>
<body>
<ul id="list">
<li>
<input type="button" value="-" />
<strong>0</strong>
<input type="button" value="+" /> 单价:
<em>8.5元</em> 小计:
<span>0元</span>
</li>
<li>
<input type="button" value="-"/>
<strong>0</strong>
<input type="button" value="+"/> 单价:
<em>8.5元</em> 小计:
<span>0元</span>
</li>
<li>
<input type="button" value="-"/>
<strong>0</strong>
<input type="button" value="+"/> 单价:
<em>8.5元</em> 小计:
<span>0元</span>
</li>
<li>
<input type="button" value="-"/>
<strong>0</strong>
<input type="button" value="+"/> 单价:
<em>8.5元</em> 小计:
<span>0元</span>
</li>
</ul>
<script>
/*
利用传参方式,完成购物车的加减
1.尽量相同的HTML结构
2.尽量通过父元素寻找元素
*
* */
var oList = document.getElementById("list")
var aLi = oList.getElementsByTagName("li")
for (var i=0;i<aLi.length;i++) {
tab(aLi[i])
}
function tab(obj){
var oInput = obj.getElementsByTagName("input")
var oStr = obj.getElementsByTagName("strong")[0]
var oSpan = obj.getElementsByTagName("span")[0]
var num = 0
// console.log(oInput[1])
oInput[1].onclick = function() {
num++
// console.log(num)
oStr.innerHTML = num
oSpan.innerHTML = 8.5 * num + "元"
}
oInput[0].onclick = function() {
num--
// console.log(num)
if(num<0){
num=0
}
oStr.innerHTML = num
oSpan.innerHTML = 8.5 * num + "元"
}
}
</script>
</body>
</html>
js加减运算·传参的更多相关文章
- js实现文本框支持加减运算的方法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/T ...
- velocity加减运算注意格式 ,加减号的左右都要有空格
velocity加减运算注意格式 ,加减号的左右都要有空格 #set( $left= $!biz.value - $vMUtils.getReturnMoney($!biz.billBuy) )
- [Swift]LeetCode592. 分数加减运算 | Fraction Addition and Subtraction
Given a string representing an expression of fraction addition and subtraction, you need to return t ...
- C语言中指针变量的加减运算
1.指针变量中存放的是地址值,也就是一个数字地址,例如某指针变量中的值是0x20000000,表示表示此指针变量存放的是内存中位于0x20000000地方的内存地址.指针变量可以加减,但是只能与整型数 ...
- 大整数加减运算的C语言实现
目录 大整数加减运算的C语言实现 一. 问题提出 二. 代码实现 三. 效果验证 大整数加减运算的C语言实现 标签: 大整数加减 C 一. 问题提出 培训老师给出一个题目:用C语言实现一个大整数计算器 ...
- Linux中日期的加减运算
Linux中日期的加减运算 目录 在显示方面 在设定时间方面 时间的加减 正文 date命令本身提供了日期的加减运算. date 可以用来显示或设定系统的日期与时间. 回到顶部 在显示方面 使用者可以 ...
- void *指针的加减运算
1.手工写了一个程序验证void *指针加减运算移动几个字节: //本程序验证空类型指针减1移动几个字节 #include <stdio.h> int main(int argc, cha ...
- JS XMLHttpRequest.upload.addEventListener 传参,回调
JS 回调函数,传参的办法. function uploadFile(t) { var fd = new FormData(); fd.append("_netLogo", doc ...
- Leetcode 592.分数加减运算
分数加减运算 给定一个表示分数加减运算表达式的字符串,你需要返回一个字符串形式的计算结果. 这个结果应该是不可约分的分数,即最简分数. 如果最终结果是一个整数,例如 2,你需要将它转换成分数形式,其分 ...
随机推荐
- javascript 高级程序设计 八
function 类型: 1.ECMAscript中函数和类C语言的函数有这很多不同.其中之一就是js的函数没有重载.并且多次定义一个同名的函数,当调用这个函数的时候, 会调用最后一次定义的函数. 2 ...
- Python代码运行应该注意哪些问题?
Python作为近年来热度一度高涨的编程语言,非常受广大程序员的喜爱,用过之后发现这门语言有很多特点.比如作为一门动态语言它的变量是信手拈来就可以用的,甚至比js还简单,也没有编程语言常见的大括号包含 ...
- match
//清空数据match (n) detach delete n (一)查询节点1.查询所有节点 //查询数据库中的所有节点 match(n)return n 2.查询带有某个标签的所有节点 //查询数 ...
- Can I win LT464
In the "100 game," two players take turns adding, to a running total, any integer from 1.. ...
- maven下载的jar相应pom文件下载不完整问题。
今天遇到一个奇葩问题: 同样的项目,我启动报错 : 某个class文件找不到.. 查找maven 依赖也的确没有找到 对应的jar 包. 查找同事项目,可以看到该class对应的 jar 包 是 lo ...
- nginx设置代理配置
server { listen 8086; resolver 8.8.8.8; location /{ ...
- ajax的基础
去年也是这个时候,开始学了ajax,也是这个技术领我走上了网页制作的道路,于是这样感觉到手写html比之前的dw拖拖拽拽要有意思得多. 话不多说,下面是一个例子: 这个是ajax显示页面:index. ...
- 2017/2/5:oracle数据库的三大文件
oracle的三大文件: 一:控制文件:控制文件是一个小型的二进制文件,可以记录数据库的物理结构.包括: * 数据库名称 * 数据文件和日志文件的名称和位置 * 数据库创建的时 ...
- OneZero第三周第三次站立会议(2016.4.6)
1. 时间: 13:05--13:15 共计10分钟. 2. 成员: X 夏一鸣 * 组长 (博客:http://www.cnblogs.com/xiaym896/), G 郭又铭 (博客:http ...
- [ASP.net]web.config的customErrors与httpErrors的区别
之前一直知道设置web.config(其实就是xml文件)的customErrors的error来指向自定义的错误页的URL,但是今天在调试的时候发现customErrors无法跳转到自定义的页面,在 ...