Use javascript to write a click on the addition and subtraction button on the page to achieve the accumulation of numbers.
The simple html is probably the case. Just understand it, don't care about these details
<input type="button" value="+" onclick="jia(this)" /><label>0</label><input type="button" value="-" onclick="jian(this)" />
It looks like this
The javascript code is as follows
<script type="text/javascript">function jia(a){var nextnode = a.nextElementSibling;//Get the next node alert(nextnode.innerHTML);var a = parseInt(nextnode.innerHTML)a += 1;nextnode.innerHTML = a;}function jian(a) {var previousnode = a.previousElementSibling;var a = parseInt(previousnode.innerHTML)a -= 1;a = a > 0 ? a : 0;previousnode.innerHTML = a;}</script>Let's explain:
function jian(a) and
function jia(a) is the object currently clicked. Add this to the method of onclick event;
- nextElementSibling Get the next node of the current node (get the next sibling node)
- previousElementSibling Get the previous node of the current node
Note: IE will skip the space document nodes (such as line break characters) generated between nodes, and Mozilla will not do this - FF will treat typesetting elements such as space breaks as node reading. Therefore, the next node element that can be read by nextSibling in ie needs to be written in FF: nextElementSibling.
The above explanation means using nextElementSibling and previousElementSibling to obtain the next sibling node and the previous sibling node. You can remove line breaks, spaces, etc. and directly find our tag elements. But the following two
nextSibling
PreviousSibling also needs the next brother node and the previous brother node, but it is easy to use in IE
--------------------------------------------------------------------------------------------------------------------------------
parseInt conversion function.
a = a > 0 ? a : 0;----- ternary expression.