黑马程序员技术交流社区

标题: 【广州校区】【原创】javascript基础笔记 [打印本页]

作者: yuhaohong    时间: 2018-4-12 14:03
标题: 【广州校区】【原创】javascript基础笔记
javascript
[JavaScript] 纯文本查看 复制代码
<script>
    window.onload = function(){
        //获取页面指定位置的元素
        var uEle = document.getElementById("username");
        //alert(uEle);
        //获取页面指定位置的内容(值)
        var uValue = uEle.value;
        alert(uValue);
    }
</script>
[HTML] 纯文本查看 复制代码
<form action="#" method="get">
</form>

js基本语法简单的数据校验轮播图
[JavaScript] 纯文本查看 复制代码
<!--简单切换图片-->
<script type="text/javascript">
    var picNum = 1
    function switchImg() {
        picNum++;
        if (picNum > 3) {
                picNum = 1;
        }
        picSrc = document.getElementById('img1').src = "../../img/"+picNum+".jpg"
    }
</script>
[JavaScript] 纯文本查看 复制代码
<!--自动轮播-->
<script type="text/javascript">
    var num = 1
    function init() {
        window.setInterval("swithcImgAtuo()",3000)
    }
    function swithcImgAtuo()  {
        num++
        if (num > 3) {
            num = 1
        }
        document.getElementById("img1").src = "../img/"+num+".jpg"
    }
</script>
定时弹出广告
[JavaScript] 纯文本查看 复制代码
<script type="text/javascript">
    function init(){
        //书写轮图片显示的定时操作
        setInterval("changeImg()",3000);
        
        //1.设置显示广告图片的定时操作
        time = setInterval("showAd()",3000);
    }
   
    //书写函数
    var i=0
    function changeImg(){
        i++;
        //获取图片位置并设置src属性值
        document.getElementById("img1").src="../img/"+i+".jpg";
        if(i==3){
            i=0;
        }
    }
   
    //2.书写显示广告图片的函数
    function showAd(){
        //3.获取广告图片的位置
        var adEle = document.getElementById("img2");
        //4.修改广告图片元素里面的属性让其显示
        adEle.style.display = "block";
        //5.清除显示图片的定时操作
        clearInterval(time);
        //6.设置隐藏图片的定时操作
        time = setInterval("hiddenAd()",3000);
    }
   
    //7.书写隐藏广告图片的函数
    function hiddenAd(){
        //8.获取广告图片并设置其style属性的display值为none
        document.getElementById("img2").style.display= "none";
        //9.清除隐藏广告图片的定时操作
        clearInterval(time);
    }
</script>
javascript引入方式BOM表单验证js中正则校验

作者: 纯情小飞飞    时间: 2018-4-12 20:58
很详细,不错不错!




欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2