Javascript scrollTop 20大洋

花了20大洋,买了一个视频,这是读书笔记

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <style>
        body, div {
            padding: 0px;
            margin: 0px;
        }

        #div1 {
            margin-left: 100px;
            margin-top: 20px;
            width: 150px;
            height: 200px;
            overflow: hidden;
            background: #dddddd;
        }
    </style>
</head>
<body>
    <div id="div1">
        港媒称,日前,一则“女明星冷冻卵子”新闻让“冻卵子”进入了公众视野,不少超过平均育龄期的妇女纷纷向医院打听冷冻卵子的过程及相关费用和安全性。国家计生委相关负责人近日对媒体表示:冷冻卵子技术属于人类辅助生殖技术范畴,目前尚处于临床研究阶段。按照中国目前法律,未婚单身女性禁止进行在国内进行冻卵手术。
        据香港《南华早报》网站7月27日报道,国家卫生计生委妇幼健康服务司负责人在接受“新华视点”采访时表示,冷冻卵子技术属于人类辅助生殖技术范畴,目前尚处于临
        aaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaaaaaaaaaa
    </div>
    <script type="text/javascript">
        var ele = document.getElementById(‘div1‘);
        //  ele.offsetLeft;  ele.offsetWidth; 只读属性,不能赋值,要想赋值,只能写  ele.style.width = 500 + ‘px‘;
        //ele.scrollTop = 150;
        //ele.scrollHeight - ele.clientHeight;//滚动条能达到的最大值;超出的高度
        /*第一种:
        -function () {

        }();
        第二种:
        (function(){

        })()
       第三种:
       ~function(){

       }();

       --三种写法都是一样的,让一个匿名方法自运行
        */
        /**/
        //ele.innerHTML += ele.innerHTML;
        (function () {
            var val1 = ele.scrollTop;
            ele.scrollTop++;
            var val2 = ele.scrollTop;
            //if (val1==ele.scrollTop) {//走到头了

            //}
            if (ele.scrollTop==ele.scrollHeight) {
                ele.scrollTop = 0;
            }
            window.setTimeout(arguments.callee, 6);
        })();

        var dirction = 1;
        (function () {
            var val1 = ele.scrollTop;
            //  ele.scrollTop++;
            ele.scrollTop += dirction;
            var val2 = ele.scrollTop;
            if (val1==val2) {//已经到了最大的边界了
                //ele.scrollTop = 0;//从头开始
                dirction = dirction * (-1);//来回滚动
            }
            /*
            1.arguments.callee调用自身模块
            2.arguments 该对象代表正在执行的函数和调用他的函数的参数。
            */

            window.setTimeout(arguments.callee, 6);
        })();

        var innerHTML = ele.innerHTML;
        (function () {
            var val1 = ele.scrollTop;
              ele.scrollTop++;
              var val2 = ele.scrollTop;
              if (val1==val2) {
                  ele.innerHTML += innerHTML;
              }
           window.setTimeout(arguments.callee, 10);
        })();
    </script>
</body>
</html>

  

时间: 2024-08-27 22:29:20

Javascript scrollTop 20大洋的相关文章

JavaScript(20)jQuery HTML 添加和删除元素

jQuery - 添加元素 通过 jQuery,可以很容易地添加新元素/内容. 添加新的 HTML 内容的四个 jQuery 方法: append() - 在被选元素的结尾插入内容 prepend() - 在被选元素的开头插入内容 after() - 在被选元素之后插入内容 before() - 在被选元素之前插入内容 jQuery append() 方法在被选元素的结尾插入内容. $("p").append("Some appended text."); jQue

JavaScript基础20——element对象

1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>element对象</title> 6 <script type="text/javascript"> 7 // element对象 8 /* 9 获取属性:getAttribute(name) 10 设置属性:setAttribute(name

Effective JavaScript Item 20 使用call方法来绑定this变量

本系列作为Effective JavaScript的读书笔记. 通常而言,一个函数中this的指向和该函数的调用类型相关,比如当函数直接作为函数被调用时,this一般指向的是全局对象(StrictMode时指向undefined):当函数作为方法被调用时(即x.method()这种形式),this指向的是x:当函数作为构造方法被调用时,this指向的是一个新创建的对象. 但是在一些场合,需要指定this的指向,比如下面的代码需要将this指向一个对象obj,一个简单的办法如下: obj.temp

javascript scrollTop在浏览器中的差异

相信有很多新手朋友经常会遇到document.body.scrollTop 一直为0的情况,今天刨根问底,找到问题所在: 火狐和其它标准浏览器 1. 在没有doctype声明的页面里可以使用  document.body.scrollTop 来获取 scrollTop高度 ; 2. 在有doctype声明的页面里可以使用  document.documentElement.scrollTop 来获取 scrollTop高度. 苹果浏览器 1. 无论有没有doctype声明 都只能document

JavaScript(20)jQuery HTML 加入和删除元素

jQuery - 加元 经 jQuery,可以非常easy增加了新的元素/内容. 加入新的 HTML 内容的四个 jQuery 方法: append() - 在被选元素的结尾插入内容 prepend() - 在被选元素的开头插入内容 after() - 在被选元素之后插入内容 before() - 在被选元素之前插入内容 jQuery append() 方法在被选元素的结尾插入内容. $("p").append("Some appended text."); jQu

javascript操作dom对象

什么叫DOM? DOM是文档对象模型(Document Object Model,是基于浏览器编程(在本教程中,可以说就是DHTML编程)的一套API接口,W3C出台的推荐标准,每个浏览器都有一些细微的差别,其中以Mozilla的浏览器最与标准接近. DOM属于浏览器,而不是JavaScript语言规范里的规定的核心内容. 查找元素 1.直接查找 方法名 描述 getElementById(id) (document) 获取有指定惟一ID属性值文档中的元素 getElementsByTagNam

Javascript 特效(一)返回顶部

1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>无标题文档</title> 6 <style type="text/css"> 7 *{ margin:0; padding:0;} 8 body{ height:2000px;} 9 #box{ width:40px; height:40px;

Web前端开发规范【HTML/JavaScript/CSS】

前言 这是一份旨在增强团队的开发协作,提高代码质量和打造开发基石的编码风格规范,其中包含了 HTML, JavaScript 和 CSS/SCSS 这几个部分.我们知道,当一个团队开始指定并实行编码规范的话,错误就会变得更加显而易见.如果一段特定的代码不符合规范的话,它有可能只是代码风格错误,而也有可能会是 bug.早期指定规范就使得代码审核得以更好的开展,并且可以更精确的地定位到错误.只要开发者们能够保证源代码源文件都严格遵循规范,那接下去所使用的混淆.压缩和编译工具则可投其所好不尽相同. 要

JavaScript中的各种宽高以及位置总结

JavaScript中的各种宽高以及位置总结 在javascript中操作dom节点让其运动的时候,常常会涉及到各种宽高以及位置坐标等概念,如果不能很好地理解这些属性所代表的意义,就不能理解js的运动原理,同时,由于这些属性概念较多,加上浏览器之间 实现方式不同,常常会造成概念混淆,经过研究之后,这里来进行一个总结. 第一部分:DOM对象 1.1只读属性 所谓的只读属性指的是DOM节点的固有属性,该属性只能通过js去获取而不能通过js去设置,而且获取的值是只有数字并不带单位的(px,em等),如