美文网首页
HTML5学习小记五

HTML5学习小记五

作者: 涛涛灬灬 | 来源:发表于2017-03-03 19:16 被阅读0次

1.将ul-li的展示图片横排显示,使用float:left;
2.几个常用数字验证的正则表达式

"^\\d+$"  //非负整数(正整数 + 0)
"^[0-9]*[1-9][0-9]*$"  //正整数
"^((-\\d+)|(0+))$"  //非正整数(负整数 + 0)
"^-[0-9]*[1-9][0-9]*$"  //负整数
"^-?\\d+$"    //整数
"^\\d+("  //非负浮点数(正浮点数 + 0)
"^(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*))$"  //正浮点数
"^((-\\d+("  //非正浮点数(负浮点数 + 0)
"^(-(([0-9]+\\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\\.[0-9]+)|([0-9]*[1-9][0-9]*)))$"  //负浮点数
"^(-?\\d+)("  //浮点数
var r = /^\+?[1-9][0-9]*$/;  //正整数
r.test(str);

3.删除前后空格 String.prototype.trim = function () { return this.replace(/(^[ | ])|([ | ]$)/g, ""); }
4.window.history.forward(1); 阻止页面后退;
5.一个简单的合并数组的方法

var mergeTo = [4,5,6];
var mergeFrom = [7,8,9];
Array.prototype.push.apply(mergeTo, mergeFrom);
mergeTo; // is: [4, 5, 6, 7, 8, 9]

6.当页面滑动到底部时,判断去加载的两个方法:
方法一

$(window).scroll(function() {

var scrollTop = $(this).scrollTop();//方法返回或元素的滚动条的垂直位置。

var scrollHeight = $(document).height();//整篇文章的高度

var windowHeight = $(this).height();

if(scrollTop + windowHeight >= scrollHeight) {

orderid = $("#orderidHidden").val();

getdata(usertype, notvip, orderid);//执行的请求方法
}
});

方法二

var divH = document.body.scrollHeight,top = document.body.scrollTop,windowH = window.screen.availHeight;
if ((top + windowH) >divH) {
console.log('此处执行加载的方法');
}
console.log('网页 全文高:' + document.body.scrollHeight + ' 网页被卷去的高: ' + document.body.scrollTop + ' 屏幕可用工作区高度:' + window.screen.availHeight);

7.用感叹号可以将非布尔值转化为布尔值;
8.双波浪号的作用(将内容转化为数字,或者小数取整);NUll转化为-1,
9.创建随机数:创建一个0-100以内的随机整数:var randNum = ~~(Math.random()*100);
10.一个重复的计时器,不断的改变frame,类似跑马灯效果:

<div id="tier" style="position:absolute;width:100px;height:100px;left:0px;top:10px;background:red;"></div>
    <script type="text/javascript">
        setTimeout(function()
        {
           var div = document.getElementById("timer"),
               left = parseInt(div.style.left) + 5;
              div.style.left = left + "px";

           if (left < 200){
               setTimeout(arguments.callee, 50);
           }

        }, 50);
    </script>

相关文章

  • HTML5学习小记五

    1.将ul-li的展示图片横排显示,使用float:left;2.几个常用数字验证的正则表达式 3.删除前后空格 ...

  • HTML5学习小记八

    关于一些小知识点的总结 GET 和 POST 的区别?1、 get是从服务器获取数据 -----"取"; post...

  • HTML5学习小记十

    1.将多个div水平方向上等高居中显示:height:50%;2.关于swiper的图片展示方向问题://Slid...

  • HTML5学习小记九

    1.关于ajax的一些优缺点优点1 通过异步模式,提升了用户体验2优化了浏览器和服务器之间的传输,减少不必要的数据...

  • HTML5学习小记七

    1.动画效果的第三方框架 animate.min.css(1)将animate.min.css导入到当前工程中,选...

  • HTML5学习小记一

    1.overflow : 这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll,不论是否需要,用户代...

  • HTML5学习小记三

    1.document.querySelector document.querySelector(container...

  • HTML5学习小记四

    1.图片在div中居中显示 CSS样式如下: div{width:300px; height:150px; bac...

  • HTML5学习小记十二

    关于运算符合=== 它的判断流程:如果两个值不是相同类型,它们不相等如果两个值都是null或者都是undefine...

  • HTML5学习小记十三

    appendChild()方法的使用:作用是向节点末尾添加最后的一个子节点(或从一个元素移动到另外一个元素中); ...

网友评论

      本文标题:HTML5学习小记五

      本文链接:https://www.haomeiwen.com/subject/hgjlgttx.html