window.innerHeight 是浏览器窗口可用的高度。

window.outerHeight 是浏览器窗口最大的高度。

打开chrome-inspector,上下移动inspector,看到screen右上角有坐标数字的变化。

window.scrollY  是当前顶部距离页面初始位置0的距离。创建滚动到顶,这个值是0。

HTML DOM offsetHeight Property

document.body.offsetHeight得到的是<body>元素(可以看到)的高度,包括padding, border, scrollbar, 不包括margin。(pixels)⚠️,可以看到的指content,忽略。

所以:

window.innerHeight + window.scrollY >= document.body.offsetHeight

指的是滚动到页面底部的情况。

scroll()方法被遗弃了,改用window.scrollTo(x, y)

DOM Events是针对Dom object的各类事件处理event handlers,和functions联合使用的。

Dom window也是dom对象,可以使用这些events.

关于scroll有3个写法:

1.  html:  <element onscroll="myFunction">

2. JS1: object.onscroll = function() { myScript };

3. JS2: object.addEventListener("scroll", myScript); ⚠️myScript是一个function的名字。

window对象也可以使用addEventListener()方法。虽然w3c上没有写。


query语法和rails。

posts = Post.order(id: :desc).limit(5)  ->

SELECT  "posts".* FROM "posts" ORDER BY "posts"."id" DESC LIMIT $1  [["LIMIT", 5]]

posts.last.id -> 47

posts.where("id < 47")->

#继承了posts的查询语法的结构:Post.order(id: :desc).limit(5),而不是posts集合本身。
SELECT  "posts".* FROM "posts" WHERE (id < 47) ORDER BY "posts"."id" DESC LIMIT $1  [["LIMIT", 5]]

Post.order(id: :desc).limit(5).where("id < 47")中的limit和where关键字变换位置生成的SQL是一样的⬆️。


⚠️ turbolinks内绑定的事件和内部绑定的变量。

下面的代码是位于index.html.erb的第一行:变量current_post_id第一次会设定为一个值, 在turbolinks内部的代码会改变它的值。

如果把变量current_post_id的第一次声明放到turbolinks内部,则它的值永远不会改变了。

DOM window的事件和方法; Rails查询语法query(查询结构继承); turbolinks的局限;的更多相关文章

  1. solr的查询语法、查询参数、检索运算符

    转载自:http://martin3000.iteye.com/blog/1328931 1.查询语法 solr的一些查询语法 1.1. 首先假设我的数据里fields有:name, tel, add ...

  2. .NET LINQ查询语法与方法语法

    LINQ 查询语法与方法语法      通过使用 C# 3.0 中引入的声明性查询语法,介绍性 LINQ 文档中的多数查询都被编写为查询表达式. 但是,.NET 公共语言运行时 (CLR) 本身并不具 ...

  3. C#3.0新增功能09 LINQ 基础07 LINQ 中的查询语法和方法语法

    连载目录    [已更新最新开发文章,点击查看详细] 介绍性的语言集成查询 (LINQ) 文档中的大多数查询是使用 LINQ 声明性查询语法编写的.但是在编译代码时,查询语法必须转换为针对 .NET ...

  4. elasticsearch基本概念与查询语法

    序言 后面有大量类似于mysql的sum, group by查询 elk === elk总体架构 https://www.elastic.co/cn/products Beat 基于go语言写的轻量型 ...

  5. query_string查询支持全部的Apache Lucene查询语法 低频词划分依据 模糊查询 Disjunction Max

    3.3 基本查询3.3.1词条查询 词条查询是未经分析的,要跟索引文档中的词条完全匹配注意:在输入数据中,title字段含有Crime and Punishment,但我们使用小写开头的crime来搜 ...

  6. 《C#高效编程》读书笔记08-推荐使用查询语法而不是循环

    C#语言中并不缺少控制程序流程的结构,for.while.do/while和foreach等都可以做到这一点.但我们还有更好的方式:查询语法(query syntax) 下面这段代码演示了用命令式的方 ...

  7. LINQ 学习路程 -- 查询语法 LINQ Query Syntax

    1.查询语法 Query Syntax: from <range variable> in <IEnumerable<T> or IQueryable<T> ...

  8. elastic 查询案例Query与Filter + CRUD简单理解 + dynamic mapping + keyword

    1.增 PUT mytest01/external/ { "name": "xiaowei" } curl -XPUT '192.168.1.49:9200/m ...

  9. Python Elasticsearch api,组合过滤器,term过滤器,正则查询 ,match查询,获取最近一小时的数据

    Python Elasticsearch api   描述:ElasticSearch是一个基于Lucene的搜索服务器.它提供了一个分布式多用户能力的全文搜索引擎,基于RESTful web接口.下 ...

随机推荐

  1. loading图标modal弹窗 和jquery ajax的关系

    在ajax配置中 ,async:false,非异步,modal窗口会失效,只有重新设置为async:true,或者删除async的设置,则loading的模态框才能展示出来 loading图标的模态框 ...

  2. move_uploaded_file() 函数

    定义和用法 move_uploaded_file() 函数将上传的文件移动到新位置. 若成功,则返回 true,否则返回 false. 语法 move_uploaded_file(file,newlo ...

  3. .NET获取Html字符串中指定标签的指定属性的值

    using System.Text; using System.Text.RegularExpressions; //以上为要用到的命名空间 /// <summary> /// 获取Htm ...

  4. ValueError: Only call `sparse_softmax_cross_entropy_with_logits` with named a

    第五章中完整的训练MNIST数据的神经网络模型的程序代码中,直接运行程序的话会遇到以下的错误. 把下面的这行代码 # 计算交叉熵及其平均值 cross_entropy = tf.nn.sparse_s ...

  5. linux shell 正则表达式(BREs,EREs,PREs)差异比较(转)

    add by zhj: Python的正则表达式跟Perl很像,Python的re模块文档中也说"This module provides regular expression matchi ...

  6. 【python】BeautifulSoup的应用

    from bs4 import BeautifulSoup#下面的一段HTML代码将作为例子被多次用到.这是 爱丽丝梦游仙境的 的一段内容(以后内容中简称为 爱丽丝 的文档): html_doc = ...

  7. centos shell脚本编程1 正则 shell脚本结构 read命令 date命令的用法 shell中的逻辑判断 if 判断文件、目录属性 shell数组简单用法 $( ) 和${ } 和$(( )) 与 sh -n sh -x sh -v 第三十五节课

    centos   shell脚本编程1 正则  shell脚本结构  read命令  date命令的用法  shell中的逻辑判断  if 判断文件.目录属性  shell数组简单用法 $( ) 和$ ...

  8. orcle中如何使用动态游标来对变量进行赋值

    在oracle中动态游标的概念一般不常用,但有时根据客户的特殊业务,需要使用到动态游标来解决问题!在对于一条动态SQL语句而产生多条记录时,动态游标的使用将是一个很好的选择,具体参见如下在工作流项目中 ...

  9. git-【六】分支的创建与合并

    在版本回填退里,已经知道,每次提交,Git都把它们串成一条时间线,这条时间线就是一个分支.截止到目前,只有一条时间线,在Git里,这个分支叫主分支,即master分支.HEAD严格来说不是指向提交,而 ...

  10. jQuery Form

    https://github.com/jquery-form/form#type 概念 jQuery表单插件允许您轻松,无差错地升级HTML表单以使用AJAX. 主要方法ajaxForm和ajaxSu ...