每天CookBook之JavaScript-016

使用querySelectorAll获取元素集并计算总和

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>016</title>
</head>
<body><table id="table1"><tr><td>Washington</td><td>145</td></tr><tr><td>Oregon</td><td>233</td></tr><tr><td>Missouri</td><td>833</td></tr></table>
</body>
<script type="text/javascript">
var sum = 0;
var cells = document.querySelectorAll("td + td");
for(var i = 0;i < cells.length; i++){sum+=parseFloat(cells[i].firstChild.data);
}
var newRow = document.createElement("tr");var firstCell = document.createElement("td");var firstCellText = document.createTextNode("Sum:");firstCell.appendChild(firstCellText);var secondCell = document.createElement("td");var secondCellText = document.createTextNode(sum);secondCell.appendChild(secondCellText);newRow.appendChild(firstCell);newRow.appendChild(secondCell);document.getElementById('table1').appendChild(newRow);
</script>
</html>

转载于:https://www.cnblogs.com/4thing/p/5655485.html

每天CookBook之JavaScript-016相关推荐

谷歌chrome浏览器的源码分析(五)
上一次说到类RenderThread和类RenderView把消息处理,那么这两个类是怎么样处理消息的呢?又是怎么样处理浏览的消息呢?现在就带着这两个问题去分析它的源码,理解它处理消息的方法.类Ren ...
每个 JavaScript 开发者都该懂的 Unicode
2019独角兽企业重金招聘Python工程师标准>>> 英文原文标题:what-every-javascript-developer-should-know-about-unicod ...
JavaScript中的字符串操作(转）
http://www.cnblogs.com/xuebin/articles/1296837.html 最近编一个javascript的翻译程序,发现无法正确比较两个字符串的相等,上网查了查,发现这篇 ...
检查JavaScript中变量是数字还是字符串
有谁知道如何检查JavaScript中的变量是数字还是字符串? #1楼如果要处理文字符号而不是构造函数,则可以使用typeof:. typeof "Hello World"; / ...
mega_[MEGA DEAL] 2018 Essential JavaScript编码捆绑包（96％折扣）
mega 学习世界上最重要的Web开发语言的终极指南(超过29小时,超过900页!) 嘿,怪胎, 本周,在我们的JCG Deals商店中,我们提供了另一个超值优惠. 我们将在2018 Essentia ...
前端工程师的修真秘籍（css、javascript和其它）
大部分技术,熟读下列四类书籍即可. 入门,用浅显的语言和方式讲述正确的道理和方法,如head first系列全面,巨细无遗地探讨每个细节,遇到疑难问题时往往可以在这里得到理论解答,如Definiti ...
一些javascript免费中文书籍
在这里谢谢那些无私的人~~ 这些内容来自这里: 我只把js的链接粘到这里了~ 还有其它技术文档, 实在是太多了, 多的看都看不完!!! Google JavaScript 代码风格指南 Google ...
JavaScript indexOf() 方法和 lastIndexOf() 方法
indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置. lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置,在一个字符串中的指定位置从后向前搜索. 语法: in ...
JavaScript(js)/上
JavaScript(js) ECMA-----定义的基础语法 DOM------document object model BOM------Browser object model Jav ...

每天CookBook之JavaScript-016

每天CookBook之JavaScript-016相关推荐

最新文章

热门文章