DOM window的事件和方法; Rails查询语法query(查询结构继承); turbolinks的局限;
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的局限;的更多相关文章
- solr的查询语法、查询参数、检索运算符
转载自:http://martin3000.iteye.com/blog/1328931 1.查询语法 solr的一些查询语法 1.1. 首先假设我的数据里fields有:name, tel, add ...
- .NET LINQ查询语法与方法语法
LINQ 查询语法与方法语法 通过使用 C# 3.0 中引入的声明性查询语法,介绍性 LINQ 文档中的多数查询都被编写为查询表达式. 但是,.NET 公共语言运行时 (CLR) 本身并不具 ...
- C#3.0新增功能09 LINQ 基础07 LINQ 中的查询语法和方法语法
连载目录 [已更新最新开发文章,点击查看详细] 介绍性的语言集成查询 (LINQ) 文档中的大多数查询是使用 LINQ 声明性查询语法编写的.但是在编译代码时,查询语法必须转换为针对 .NET ...
- elasticsearch基本概念与查询语法
序言 后面有大量类似于mysql的sum, group by查询 elk === elk总体架构 https://www.elastic.co/cn/products Beat 基于go语言写的轻量型 ...
- query_string查询支持全部的Apache Lucene查询语法 低频词划分依据 模糊查询 Disjunction Max
3.3 基本查询3.3.1词条查询 词条查询是未经分析的,要跟索引文档中的词条完全匹配注意:在输入数据中,title字段含有Crime and Punishment,但我们使用小写开头的crime来搜 ...
- 《C#高效编程》读书笔记08-推荐使用查询语法而不是循环
C#语言中并不缺少控制程序流程的结构,for.while.do/while和foreach等都可以做到这一点.但我们还有更好的方式:查询语法(query syntax) 下面这段代码演示了用命令式的方 ...
- LINQ 学习路程 -- 查询语法 LINQ Query Syntax
1.查询语法 Query Syntax: from <range variable> in <IEnumerable<T> or IQueryable<T> ...
- elastic 查询案例Query与Filter + CRUD简单理解 + dynamic mapping + keyword
1.增 PUT mytest01/external/ { "name": "xiaowei" } curl -XPUT '192.168.1.49:9200/m ...
- Python Elasticsearch api,组合过滤器,term过滤器,正则查询 ,match查询,获取最近一小时的数据
Python Elasticsearch api 描述:ElasticSearch是一个基于Lucene的搜索服务器.它提供了一个分布式多用户能力的全文搜索引擎,基于RESTful web接口.下 ...
随机推荐
- 【巷子】:关于Apply、call、bind的详解
call方法: 语法:call(thisObj,'',''........) 定义:调用一个对象的一个方法,以另一个对象替换当前对象 说明:call方法可以用来代替另一个对象调用一个方法.call方法 ...
- linux memory dump--http://www.forensicswiki.org/wiki/Tools:Memory_Imaging
Linux provides two virtual devices for this purpose, '/dev/mem' and '/dev/kmem', though many distrib ...
- R-CNN论文详解 - CSDN博客
废话不多说,上车吧,少年 paper链接:Rich feature hierarchies for accurate object detection and semantic segmentatio ...
- SQL Server 不同网段IP通过名称访问
1, 设置订阅服务器C:\Windows\System32\drivers\etc目录的host文件,添加分发服务器(我的环境是发布服务器与分发服务器 是一起的,所以这里指定的是发布服务器的地址)信息 ...
- 详解PHP实现定时任务的五种方法
这几天需要用PHP写一个定时抓取网页的服务器应用. 在网上搜了一下解决办法, 找到几种解决办法,现总结如下. 定时运行任务对于一个网站来说,是一个比较重要的任务,比如定时发布文档,定时清理垃圾信息等, ...
- python中的TCP及UDP
python中是通过套接字即socket来实现UDP及TCP通信的.有两种套接字面向连接的及无连接的,也就是TCP套接字及UDP套接字. TCP通信模型 创建TCP服务器 伪代码: ss = sock ...
- Java实现动态规划法求解0/1背包问题
摘要: 使用动态规划法求解0/1背包问题. 难度: 初级 0/1背包问题的动态规划法求解,前人之述备矣,这里所做的工作,不过是自己根据理解实现了一遍,主要目的还是锻炼思维和编程能力,同时,也是为了增进 ...
- Vue学习笔记之Vue指令系统介绍
所谓指令系统,大家可以联想咱们的cmd命令行工具,只要我输入一条正确的指令,系统就开始干活了. 在vue中,指令系统,设置一些命令之后,来操作我们的数据属性,并展示到我们的DOM上. OK,接下来我们 ...
- Vue学习笔记之Vue的模板字符串
0x00 模板字符串 传统的JavaScript语言,输出模板通常是这样的写的. $('#result').append( 'There are <b>' + basket.count + ...
- P1131 [ZJOI2007]时态同步(树形dp)
P1131 [ZJOI2007]时态同步 设$f[i]$为与$i$与最远的点的距离 在dfs时每次更新的时候顺便统计一下长度,不同的话就改成最长的那条并更新答案 #include<iostrea ...