【广州校区】【原创】javascript(一)-BOM - 黑马程序员技术交流社区

[JavaScript] 纯文本查看 复制代码

<script>

    window.onload = function(){

        //获取页面指定位置的元素

        var uEle = document.getElementById("username");

        //alert(uEle);

        //获取页面指定位置的内容(值)

        var uValue = uEle.value;

        alert(uValue);

    }

</script>

[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>

[AppleScript] 纯文本查看 复制代码

<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>