js与jquery知识点总结(1)

来源：互联网发布：如何快速升淘宝等级编辑：程序博客网时间：2024/06/05 20:13

js window.location.href=’url’的用法及arguments.callee的使用，详情请看我的arguments.callee这一博客

<div id="demo"></div><script>    var demo = document.getElementById('demo')    var count = 5    var speed = 1000    setTimeout(function () {        count--        demo.innerHTML = "<a href='http://www.baidu.com'>本页面将在第"+count+"秒钟之后跳转页面</a>"        if (count <= 0) {            window.location.href = 'http://www.baidu.com'        } else {            setTimeout(arguments.callee, speed)        }    },speed)</script>

js new Date的基本使用

<body>    <h1 id="aa"></h1><script>    window.onload=function () {        var h1 = document.getElementById('aa')        setInterval(function () {            var date = new Date()            var y= date.getFullYear();            var m = date.getMonth()+1;            var d = date.getDate();            var h = date.getHours();            var i = date.getMinutes();            var s = date.getSeconds();            var str = y + '年' + m + '月' + d + '日' + h + '时' + i + '分' + s + '秒';            h1.innerHTML = str;        },1000)    }</script>

发送短信倒计时的写法最核心的是this.disabled = true

<input type="text"><button id="btn">点击发送短信</button><script>    var btn =document.getElementById('btn')    var count = 60    var timer = null    btn.onclick = function () {        clearInterval(timer)        this.disabled = true        var that = this        timer = setInterval(function () {            count--            if(count>0) {                that.innerHTML = '还剩余' + count + '秒'            } else {                that.innerHTML = '重新发送短信'                that.disabled = false                clearInterval(timer)                count = 60            }        }, 1000)    }</script>

js字符串大写转化

<h1 id="big">这是大写</h1>    <h1 id="small">这是小写</h1>    <input type="text" id="txt">    <button id="btn">按钮</button>    <script>        function $(id) {return document.getElementById(id)}        $('btn').onclick=function () {            $('big').innerHTML = $('txt').value.toUpperCase()            $('small').innerHTML = $('txt').value.toLowerCase()        }    </script>

上传文件时提示格式是否正确的写法

<input type="file" name="" id="file"><span></span><script>    var file = document.getElementById('file')    file.onchange = function () {        var path= this.value        var pathname = path.substr(path.lastIndexOf('.')).toUpperCase()        //lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置，在一个字符串中的指定位置从后向前搜索。        //substr() 方法可在字符串中抽取从 start 下标开始的指定数目的字符。        // toUpperCase()是将字符转化为大写        if (pathname == '.JPG' || pathname == '.PNG') {            this.nextSibling.innerHTML = '格式正确'        } else {            this.nextSibling.innerHTML = '格式是错误的'            // nextSibling属性返回指定节点之后紧跟的节点，在相同的树层级中        }    }</script>

jquery的排他思想 siblings()

    <script src="jquery-1.11.3.js"></script>    <script>        $(function () {            $('img').click(function () {                $(this).css('border','5px solid red').siblings().css('border','0px solid')            })        })    </script></head><body><img src="images/19/1.jpg" alt=""><img src="images/19/2.jpg" alt=""><img src="images/19/3.jpg" alt=""><img src="images/19/4.jpg" alt=""><img src="images/19/5.jpg" alt="">

选中元素的索引值 $(this).index()

$(function(){        $("li").click(function () {            console.log($(this).index());        });    });

hide()的使用，括号里面写的是消失所需要的事件，例如

$(function () {            $('.ad span').click(function () {                $(this).parent().hide(1000)            })        })    </script></head><body>    <div class="ad left_ad">        <a href=""><img src="images/18/left.jpg" alt=""></a>        <span>X</span>    </div>    <div class="ad right_ad">        <a href=""><img src="images/18/right.jpg" alt=""></a>        <span>X</span>

jquery修改style的样式 (′img′).css(width:′200px′,height:′200px′,border:′1pxsolidred′)与标签自带属性的区别(‘a’).attr(‘href’,’http://www.taobao.com‘)

 $(function () {            $('#btn').click(function () {                $('body').css({backgroundColor:'pink'})                $('img').css({width:'200px',height:'200px',border:'1px solid red'})                $('a').attr('href','http://www.taobao.com')            })            $('#btn2').click(function () {                alert($('a').attr('href'))            })        })    </script></head><body>    <button id="btn">修改</button>    <button id="btn2">访问</button>    <div>        <img src="./images/1.jpg" alt="">        <a href="http://www.baidu.com">haha</a>    </div>

阅读全文

0 0