JS学习笔记 - fgm练习 - 限制输入框的字符类型 正则 和 || 或运算符的运用 i++和++i
<script>
window.onload = function(){
var aInp = document.getElementsByTagName('input');
var oSum = document.getElementsByTagName('span')[0];
var oBtn = document.getElementsByTagName('button')[0]; for (i = 0; i < aInp.length; i++)
{
aInp[i].onkeyup = function ()
{
this.value = this.value.replace(/[^\d]/,"")
// 限制输入框只能输入数字。
// 再看一遍正则的视频,以及replace用法。
};
}; oBtn.onclick = function(){
var num1 = parseInt(aInp[0].value);
var num2 = parseInt(aInp[1].value); (aInp[0].value == "" || aInp[1].value == "") ? // || 或运算符。 只要其中一个条件成立,就alert
alert("请输入数字!") :
oSum.innerHTML = num1 + num2; // 这种for循环写法不合理,会导致当2个输入框都为空时,alert两次。
// for(let i=0; i<aInp.length; i++){
// if(aInp[i].value)
// {
// oSum.innerHTML = num1 + num2;
// }else{
// alert('请输入数字');
// };
};
};
</script>
点击按钮自加1的练习
<script>
window.onload = function()
{
var oBtn = document.getElementsByTagName('button')[0]; oBtn.onclick = function()
{
var oNum = parseInt(oBtn.innerHTML);
oNum += 1; oBtn.innerHTML = oNum;
alert(oBtn.innerHTML);
}; // 示例程序的写法:
// aBtn.onclick = function ()
// {
// aBtn.value = ++i;
// alert(i)
// }; // 在赋值时区别 i++ 和 ++i
// y=i++ y的值为i (先引用,后运算)
// y=++i y的值为i+1的结果 (先运算,后引用)
};
</script>
JS学习笔记 - fgm练习 - 限制输入框的字符类型 正则 和 || 或运算符的运用 i++和++i的更多相关文章
- JS学习笔记 - fgm练习 2-5 - 函数传参 设置div样式
练习地址:http://www.fgm.cc/learn/lesson2/05.html <script> window.onload = function(){ var oDiv = d ...
- JS学习笔记 - fgm练习 2-12- 全选反选 判断CheckBox是否选中 &&运算符
练习地址:http://www.fgm.cc/learn/lesson2/12.html 总结: 1. && 运算符,从左向右依次执行,如果遇到 false,就不再继续执行后面的语句 ...
- JS学习笔记 - fgm练习 2-11- 改变图片路径 var img = new Image(); 图片预加载
<style> *{ margin: 0;padding: 0; list-style: none; } body{ background: black; } .outer{ margin ...
- JS学习笔记 - fgm练习 - 输入数字求和 正则replace onkeyup事件
<style> body{font-size: 12px;} .outer{ width: 500px; margin: 0 auto; } span{ color: #999; } in ...
- JS学习笔记 - fgm练习 - 鼠标移入/移出div样式改变
思路: div的默认样式正常设置. 鼠标移入时,发生改变的样式有3个,即 边框颜色,div背景色,字体颜色. 把这三个css改变设置在一个类名下,再通过js给div动态 添加/去除这个类名,实现div ...
- JS学习笔记 - fgm练习 - 数字自增 定时器 数字比大小Math.max
<script> window.onload = function(){ var oP = document.getElementsByTagName('p')[0]; var i = 0 ...
- JS学习笔记 - fgm练习 - 输入法下拉框 三元表达式
<script> window.onload = function() { var oBtn = document.getElementsByTagName('input')[0]; va ...
- JS学习笔记 - fgm练习 - 网页换肤
总结: 1. 点击按钮,div内部变色,边框保持颜色不变. 实现原理:其实本来就把background 和 border 分别设置了同一个颜色,看似是一个整体,其实本来就是分开的. 那么点击的时候,只 ...
- JS学习笔记 - fgm练习 - 多按钮控制同个div属性
总结: 1. 注意body里的结构安排,全部装在大div,避免多次设置不同部分居中. 2. 一排按钮居中:装在大div里,text-align: center; 3. 把相同的部分封装成函数,即 同个 ...
随机推荐
- vue父子间通信案列三($emit和prop用法)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- [Chromium文档转载,第004章]Mojo Synchronous Calls
For Developers > Design Documents > Mojo > Synchronous Calls Think carefully before ...
- javaScript [[scope]]学习笔记
在javaScript 学习中,闭包肯定是一个让人头疼的问题,而闭包必定离不开[[scope]]作用域 scope存储了执行期上下文的集合 而了解scope以及scope链又是一个十分抽象的问题 我们 ...
- Node书签
1.开源项目 [译]过去一年25个惊人的开源Node.js项目(2018版) 百度网盘下载助手
- 原生js模拟jquery中的addClass和removeClass方法
js代码: //添加类 function addClass(obj,className) { if(obj.className == '') { //如果没有class obj.className = ...
- leetcode笔记:Sort Colors
一. 题目描写叙述 Given an array with n objects colored red, white or blue, sort them so that objects of the ...
- 在vim中配置python补全,fedora 19
近期发现python是个不错的语言,值得一学,先配置下环境,让vim具有keyword补全功能,步骤例如以下,我这个是fedora,其它发行版类似 $ su ******** # yum instal ...
- zoj 1119 / poj 1523 SPF (典型例题 求割点 Tarjan 算法)
poj : http://poj.org/problem?id=1523 如果无向图中一个点 u 为割点 则u 或者是具有两个及以上子女的深度优先生成树的根,或者虽然不是一个根,但是它有一个子女 w, ...
- POJ 3172 (认真读题的题)
题目: 思路: 题目很有意思 首先 题里说:N<=1000 题里又说 诶呦 woc? 这不自相矛盾嘛 最坏情况也就是个 斐波那契数列 几十个数 暴搜+剪枝不就好了嘛 剪枝:从大往小搜,如果前缀和 ...
- 虚拟机中试用windows 8(视频)
虚拟机中试用windows 8(视频) VM7装windows 8基本没戏,建议用正式版vmware8.0,还有Oracle的Virtualbox 也没问题http://www.virtualbox. ...