tp框架中的一些疑点知识-7
- mysqli是用面向对象的,所以用箭头对象语法, 而mysql是用C语言面向过程写的, 所以用的都是php全局函数 式的写法.
tinkle: 叮叮当当的响; (口语)一次电话, i will give you a tinkle tonight.
cascade: ['k2skeid] 瀑布; 级联..
symbol: 符号代号: 一种用于打印或书写的符号.
notation: 主要是口语中的符号, 记号.
所以 json: 就是js: js object notation: 是js的一种对象标记/表示的 "格式" 方法,
### 也就是任何时候, 使用json 都不要忘了 它仅仅只是一种格式, 如同html仅仅是一种语言标记方法, 你不能说html是哪篇网页, 即: json不是什么"实体", 它不是字符串, 不是数组, 不是对象. 只是一种格式, 这种格式可以用来表示任何的实体, 但都要加上 "格式"两个字: 比如: json格式的对象, json格式的 字符串, json格式的数组等..., 但不能说: json对象, json字符串, json数组这是错误的! ====================摘自: http://www.jb51.net/article/107041.htm
JSON是什么？(JSON和JavaScript对象有什么区别？)如何把JS对象转化为JSON字符串，又如何把JSON字符串转化为JavaScript对象？
JSON （JavaScript Object Notation）一种简单的**数据格式**，比xml更轻巧。 JSON 是 JavaScript 原生格式，这意味着在JavaScript 中处理 JSON 数据不需要任何特殊的 API 或工具包。JSON的规则很简单： 对象是一无序的“名称/值”对集合。一个对象以“{”（左括号）开始，“}”（右括号）结束。每个“名称”后跟一个“:”（冒号）；“名称/值”对之间使用“,”（逗号）分隔。
它是一种严格的js对象的格式，JSON的属性名必须有双引号，如果值是字符串，也必须是双引号；
JSON只是一种数据格式（或者叫数据形式）;
<script>
var obj2={};//这只是JS对象
var obj3={width:100,height:200};/*这跟JSON就更不沾边了,只是JS的 对象 */
var obj4={'width':100,'height':200};/*这跟JSON就更不沾边了,只是JS的对象 */
var obj5={"width":100,"height":200,"name":"rose"}; /*我们可以把这个称做：JSON格式的JavaScript对象 */
var str1='{"width":100,"height":200,"name":"rose"}';/*我们可以把这个称做：JSON格式的字符串 */
var a=[
{"width":100,"height":200,"name":"rose"},
{"width":100,"height":200,"name":"rose"},
{"width":100,"height":200,"name":"rose"},
];
/*这个叫JSON格式的数组，是JSON的稍复杂一点的形式 */
var str2='['+
'{"width":100,"height":200,"name":"rose"},'+
'{"width":100,"height":200,"name":"rose"},'+
'{"width":100,"height":200,"name":"rose"},'+
']' ;
/* 这个叫稍复杂一点的JSON格式的字符串 */
</script>
JSON和JS对象区别对比表
总而言之你可以理解为JSON是JS下的一种数据格式，他从属于JS，并且在处理JSON数据时可直接使用JS内置API
javascript中的对象, 其成员 的名称, 可以 不加 引号, 也可以加 单引号, 也可以加 双引号! 都是可以的! 但是, json格式的话, 前面的名称 就必须 加 "双引号" 是引号, 而且是 "双引号", 单引号都是错误的. 后面的值如果是字符串, 也必须是 双引号!
======================alt和title属性的区别?
- alt是图片在不能显示时的 替换文字. 只有对img元素适用. 是对 图片本身的/本来的 信息的描述.(也就是说, 这个图片本来就是什么的)
- title 则是 可以应用在 除head内的标签 之外的所有元素 都可以使用的. 不是对图片本身的描述, 而是一些 额外性的/ 指示性的/ 建议性的文字信息, 一个最典型的应用是: 比如在链接上 设置title 提示浏览器者
链接将跳转到什么地方去.
- alt和title都必要, 要注意区别 他们在 语义上的 区别. 不要在alt和title中堆积关键字, 否则会引起引擎惩罚.
为什么用win-记事本编写的html 里面规定了<meta http-equiv="Content-type" content="text/html; charset=utf-8" /> 浏览器里面还是显示中文乱码?
这就告诉我们, 今后要转变思维了: 浏览器要把网页 解析(渲染) 出来, 实际上是关系到两个事情
- 一个是 你这个网页的内容, 本身是用什么 编码 进行保存的, 所以就是要注意 编辑器保存文件时的默认编码?
- 另一个才是 你告诉浏览器要按什么 编码字符集来 "解释" 文档内容
- **编辑器notepad, editpuls, vim dw等 保存文件时的 编码, 这个问题实际上 是被我们 常常忽略的问题! **
- **实际上每个编辑器本身 是 提供了这个 编码字符集的设置的! notepad默认的保存字符集编码是ansi, 所以 你告诉浏览器用utf8 的字符集来 解读ansi的内容肯定是乱码的. ** 而其他常用的编辑器的默认编码通常是
utf8, 所以你在页面中写用utf8 就正好 暗合了!
============================
关于js中的this和$(this)
以下部分内容摘自: jquery的this和$(this)的区别总结 csdn
不管当前对象是什么, 反正脚本中的this 总是指的是: html元素, 因此对this就只能使用 js原生的属性和方法, 而不能使用jquery中提供的对象方法; 反之,
$(this)就是包装成了jquery对象, 于是就不能使用原生的html元素属性和方法, 而只能使用jquery提供的对象方法和属性. 比如: `this.title='sometext'; 而
用$(this)就是: $(this).attr('title', 'sometext'); `
不要滥用 $(this): 就是如果只是要获取html元素简单的属性的话, 就直接使用 this.some_attr 就行了.这样更简洁!
推论到css就是, 不要什么都用css, 凡是 html元素本身的属性能够解决的简单问题, 就直接用属性了, 比如table 的width, bgcolor, bordercolor,
cellspacing, cellpadding等
表单的文本框, 因为不知道你是来输入/显示什么内容的,所以要在前面写上提示文字, 为了简洁, 你也可以在文本框中预先设置value来提示.
js中定义的变量, 可以是任意类型的: 即 var foo=1 , 'string' ,[1, 2, 3] , new object, {name: "bar", addr: "chengda"}, $('#someNode') 可以是我
们常见 的 整数, 字符串, 还可以是 js对象, 或者 jquery对象 都是可以的
this的一个经典定义: 是指 !当前! 包含他的函数, 作为方法被调用时, 的所属html对象. 注意是html对象. 而且 不管前面它调用方法的
对象是 原生的html对象, 还是 jquery对象, this始终是/ 都是 原生的html元素.
js中的函数名(称), 可以通过赋值 传给一个事件函数. 注意这里的赋值 仅仅只是函数名. 因为前面的事件, 也只是一个函数名称! 比如:
htmlNode.onclick= someFunc; 这里的onclick 就只是字符串的, 函数事件名称, 所以后面也只能用someFunc, 而不能用 someFunc().
js脚本中, 既可以使用原生的js代码,也可以使用jquery的代码, 所以原生的js事件函数等也要了解!
但是, 要知道, 不管是原生html元素还是jquery对象,当访问 html规范中,不存在的元素属性时, 都会返回 'undefined' 的结果,表示未定
义, 但是 如果 为了编程需要, 或为了扩展更强大的属性功能: 你确实要 /就是要 使用 非规范中的元素属性的话, 你可以用jquery的attr 方法, 访问非规范属
性, 但是原生语法就不能够!
js中的this指针跟传统意义的面向对象不同, js中的this指针是一个 "动态变量" 即: 同一个方法内的this指针并不是始终执行 定义该方法的对象的!
比如下面的例子中, 第一个位置pos1处的this指的是div这个元素, 弹出的是div的title, 而第二个位置pos2处的this指的是 类.other所指的元素, 于是 弹出的
是.other的类所指的段落元素.
<script>
$(document).ready(
function(){
$('div').hover(function(){
[pos1:] alert(this.title); // 这里的this 是指div这个html元素
},
function(){
var op=$('.other'); // 这里定义的是 jquery对象
op.click(function(){ // 这里调用方法的 也是jquery对象
[pos2:] alert(this.title); // 但是, 这里仍然还是指 .other这个类所指的html元素(段落) 而不是jquery对象
});
}
);
}
);
</script>
改变思维: 并不是在页面内, 只要看到滚动条, 就认为是iframe, 实际上, css的overflow也可以做到在一个div内显示滚动条: 属性有: visible,hidden,
scroll, auto.
.prettyprint {
position:relative;
overflow-y:hidden;
overflow-x:auto
}
css, 要设置在某个方向上的 属性的样式, 比如在左右上下, x轴y轴 left, right, x, y, 这些表示方向性的, 要写在/ 设置在 样式名称上, 而不是写在css样式值上!!! 事实上, 样式值总是固定的那几个, 不会有方向上写法 变化 的. 所以 这里的overflow就是: overflow-x, overflow-y
- jquery的val方法?
-
它是用来获取/设置 具有value属性的元素的值 的, 要注意, 只有 元素具有value属性的, 才能使用这个方法有效.否则无效.
-
val只是用来获取value值, 并不会向元素添加
value=...这样的属性, 要真正的向元素写上value属性, 要用 attr('value', ...)方法. -
因为通常只有 form 表单元素才有 value属性, 所以我们经常看到的是, val()方法 都只在 form表单元素上使用.
===============================
- jquery选择器的返回值， 有两种情况：
- 如果是多个元素， 则返回一个 数组： 由html元素组成的 <模板>数组： 即： Array<Element(s)>
- 如果是返回的一个对象， 则是 jQuery对象
掌握jquery选择器 (不包括筛选方法) 分为基本选择器 ， 和 过滤选择器，
-
过滤选择器，除了属性过滤外，都是用冒号(：)来表示选择过滤的. 主要包括：
- 表单过滤器，用类型来过滤, 比如 :input, :text :checkbox :radio :reset :submit :file
- 表单属性过滤器， 有四种表单属性，:enabled, :disabled, :checked :selected- 基本过滤器， 是说的在多个 （同级）的数组元素中,进行选择某一个数组元素 :first, :last, :odd/even, :eq(这个就是正宗的数组元素的用法了,而且索引从0开始的），:gt, :lt, :not(selector支持任意的选择器）， 最后还有一个:header.
- 和基本过滤器相类似的是： 子元素过滤器，只是要加上-child, 包括： nth-child(index这里的索引从1开始的，也支持odd和even）， :first-child :last-child , :only-child
- 可见性过滤器 (有两个) :hidden, :visible
- 内容选择器....
==== ========================================
- 区分两个概念：
- 后代基本选择器中的 “祖先 后代", 是指一个标签元素下的 各个子级的元素都算. 祖先是指各个元素的 只要是它前面的 所有各个级别的 祖先元素都算.
- 父子元素: 是指一个标签元素后的 最近一级 的子元素. 和父元素.
jquery方法, 包括五类: 文档处理方法, 事件方法, 效果方法, ajax方法, 筛选方法
- **筛选函数 和 选择器的区别是, 筛选函数 还包含一个 可选的 参数, 这个可选参数是一个 过滤表达式, 这样这个过滤表达式, 比参数为空的筛选函数 过滤功能更强, 更细 **-
过滤表达式, 通常是一个 "字符串", 也可以是字符串和变量的 拼接 相加, 比如: is('.'+className);
-
要得到你要选取的dom对应的jquery对象, 你可以使用选择器, 也可以使用 "筛选方法", 但是推荐 首先使用 选择器..
-
筛选方法, 包括 过滤函数和 查找函数.
-
过滤函数, 包括 eq, is, not, has(是指所有的后代元素中是否包含...), hasClass. 等等, 其中只有 is和hasClass 的返回值是 boolean.
-
查找函数, 包括 (children, find) parent, parents, next, nextAll, prev, prevAll,
- 其中, parent是查找父元素, parents是查找祖先元素
- children是查找 直系的子元素, 那么查找后代元素, 则是 find.
- next是紧邻后面的同级元素, nextAll则是所有在后面的 同级元素.
- siblings 则是所有的同辈元素, 不管是之前还是之后的.注意的是, 父元素/祖先元素, 跟 子元素/后代元素的一个 差别, 就是 祖先元素选择出来时, 会把 当前元素对象包含进去.
===============================
jquery的ajax方法说明
-
主要的ajax方法包括: 原始的$.ajax, $.get(); $.post(), $.getJson, $.getScript, load. 这几种方法.
-
再次声明, ajax中的参数, 虽然都是可选的, 但是并不需要挨着挨着来写, 如果中间没有某个参数, 也不需要加空串或null来站位, 直接写后面的参数. 这个 跟传统的 c/C++的缺省参数不一样. 因为 这些参数的 格式, 每一个都不一样, 所以你即使省略中间的某一个不写, 解析器也能分析的出来, 不会产生误解和混乱...
-
type: 默认的是get. get和post的区别跟表单提交时的method方法区别是一样的, 就是get提交数据更少, 更不安全, 但是效率更高.
-
dataType: 主要包括: html,text, script, json. 如果不指定的话, 会根据 **http包信息(头信息)中 /报头/包头中的 mime信息来自动判断. 这个是用来 指定 返回给 回调函数的 数据data的 格式的. 这个返回数据data, 是已经经过服务器处理了的了. 比如json, 经过服务器处理后, 给回调函数使用时, 就已经是一个js对象了. 即: 在callback函数中, 就直接可以作为 js对象进行使用了.
-
传递给 url的数据, 可以用 js对象格式{....}, 也可以用 "k1=v1&k2=v2.."的字符串格式. 通常使用前者.
-
\(.post和\).get中的返回数据类型并没有明确表示, 如果你要显示指定的话, 还是要在函数的最后一个参数中指定, 当然也可以显式的在函数名中指定, 比如直接调用 $.getJson, $.getScript...
-
ajax的请求地址url, 可以是任意文件, 不一定是后台的动态脚本php文件(虽然这种情形比较多), 还可以是文本文件, html文件等都可以. 这些文件在浏览器 载入完成后, 要重新去获得,都叫ajax. 因为这些文件 都是从服务器上获得的, 浏览器不可能在本地访问到文件的.
-
\(.get和\).post的回调函数都是 "成功"后的执行函数, 如果你要在失败时调用函数, 文档明确说了, 用$.ajax
=====================================
文档处理函数中的 appendTo, prependTo afterInsert beforeInsert 这四个函数是 破坏性函数, 意思是, 前面选择的元素, 将要被 处理到 其他的元素中, 因此 返回的是 "整个被插入/追加"后的 整体结果. 返回值不再是之前选中的元素. 要选中原来的元素, 要用end方法.
======================================
js对象 的成员名称要不要加引号?
- 通常情况下, (成员名称是规范命名的时候), 是可以加引号(单引号或双引号都可以), 也可以不加引号的,
- 在引用对象的成员变量时, 可以有两种方式: 一种是数组方式 o['age'], 另一种是 点语法 o.addr
- 只有在什么时候, 需要加引号呢? 就是 在 js对象的成员 不是按规范语法来命名的时候, 比如它以数字开头来命名: 这时候, 在
在定义的时候, 需要加引号来界定, reference时, 也要用数组方式加引号, 就不能用点语法了.
var o = {'name': 'oaka', "age": 20, addr:'chengda'};
console.log(o.name + " " + o['age'] + " " + o.addr);
// 下面的输出跟 上面的是一样的. 这时候, 就必须用引号了!
var p = {'1name': 'oaka', "2age": 20};
console.log(p['1name']+ " " + p['2age']);
// 如果不加引号 就会报错: SyntaxError: identifier starts immediately after numeric literal
vim的复制和删除操作, 前后不同的方向 效果略有不同:
- 当从前向后 复制和删除时, 要包含光标所在的字符
- 而从后向前操作时, (复制或删除时, )则不包含光标所在字符!
这个在 复制或删除 带有括号的 内容时 要注意.
关于p和P的粘贴操作?
- 要分 被粘贴的内容, 是否带有 换行符? 也就是 是否是整行内容.
- 如果不是整行, (没有换行符), 则 是粘贴在 本行内, p在当前光标后, P则在前.
- 如果是整行内容, (带有换行符), 则总是 不跟 当前内容在同一行内, 总是 另外在一行. p在下一行, P在上一行
vim的缓冲区?
- 通过ls查看的显示是: a和h: a是active被激活的缓冲区, h是hidden 表示被隐藏的缓冲区;
%和#: %表示当前缓冲区, # 是交换缓冲区, 对于交换缓冲区的切换: 既可以通过 ctrl+6 也可以通过 :b# 直接切换 - 如果缓冲区有 + 号, 表示 该缓冲区的文件内容已经被修改, 但是还没有保存.
注意, jquery的选择器的 参数, 必须是 字符串! 除了: document 和 window 这两个(对象)参数 不用 引号外,其他的都 必须是 字符串! 参数中可以包含变量, 但是要用 加号来和其他字符串拼接
因此, 如果选择器 要包含可变的 变量时, 则必须通过js的字符串拼接运算符 "+" 来连接.
关于 过滤选择器 :nth-child的用法
nth-child后面可以跟数字, odd/even, 或表达式
表达式 中的 固定符号 只能是 n, 不能是其他任何字符,比如i. 那是不行的,
而且表达式中 你不需要 用乘号, 比如 :nth-child(3*n) , 这种写法是错误的!
而且, 这个n的值是从0 1 2 3... 一直往上可以取值的. (虽然nth-child总是 从1 开始的)
但是, 这个n 并不需要你去定义var n=0 或1... 即使你定义了var n... 其中的3n, 3n+1 跟这个定义的n变量没有任何关系.
<div>
<p class="p1">p1</p>
<p class="p2">p2</p>
<p class="p3">p3</p>
<p class="p4">p4</p>
<p class="p5">p5</p>
</div>
<script>
var n=10;
$('div>p:nth-child(2n)').css('color', 'red'); // 这里的n和前面定义的变量没有任何关系的!
$('div>p:nth-child(2n+1)').css('color', 'blue');
$('div>p:nth-child(2n+3)').css('color', 'gold');
</script>
一个老问题: sql语句中如果包含变量时的单双引号问题
-
$sql语句 最外面使用双引号, 是出于php 语法语法需要, 因为字符串要加引号.
-
而sql语句内, where子句中的字段是char/varchar类型时, 也应该加引号, 这时sql语句的要求
-
但是, where子句中的变量是数组元素时, 你也要加引号. 如果不加引号, 会认为assumed 索引是一个constant 而引发一个 E_NOTICE级别的错误.
-
首先, 在变量的 引号前面加 反斜杠 想转义是不行的, 会报错
-
其次, 这时, 如果按原来的方式来处理, 不管你在变量中 使用单引号还是 双引号, 都会 出错.
-
解决方法是两个: 一个是 将变量独立出来, 用点号连接拼接字符串; 第二个是用 大括号包装变量
"....'{$row["addr"]}'....". 当用大括号包装后, 里面就是一个 独立的部分了, 跟大括号外面的部分就没有关系了, 这时候, 里面用单引号, 还是用双引号, 都没有关系的. 都是可以的! -
大括号 {} 只有在两种情况下使用, 一是 语法控制结构, 比如if while等 ; 另一种情况就是放在字符串中 用来界定变量边界, 除此之外, 使用大括号都会出错.
-
但是 要注意的是 虽然用大括号包裹, 可以隔断 跟外界的影响, 这时候大括号内部, 不管是使用单引号, 还是双引号 都是可以的, 都不会出错! 但是 如果包裹大括号的是 单引号, 变量是不会自动替换生效的, 所以, 总的 最外面的部分 还是必须用 双引号, 大括号内的变量才能自动生效替换.
================
一种思维和方法论: 在写一些效果的时候, 本身的html元素,比如div等 你要先写出来, 然后它们的显示效果和动画等, 你再通过css和js来控制
**对于div和p标签而言, 标签本身的居中, 和 里面的内容居中 使用的css是不同的. **
- 如果要标签本身 居中, 使用 margin: 0 auto
- 如果要标签中的内容居中, 使用 text-align属性(text-align:表示 里面的 文字和图片 居中方式) (但是这时候标签本身还是默认的左排列对齐的)
js中的变量定义时 是否必须使用ｖａｒ？
-
如果是在函数外部定义, 变量为全局变量, 此时要不要var都是一样的, 都是全局变量
-
如果是在 函数内部定义, 则: 如果加var, 表示此变量是局部变量, 只在函数内有效; 如果不加var, 表示定义的是一个全局变量.但是要这个全局变量生效,
必须要使该函数被执行/调用一次才有. 否则, 如果输出一个 没有定义的/没有的变量, 会报错:ReferenceError: 'foo' is not defined -
所以,为了规范, 还是按要求来, 加上var. 而且如果定义全局变量, 最好还是在函数外定义.
<script>
var a=1;
b=2;
function foo(){
var c=0;
d=5;
}
console.log('a='+a+ " b="+b ); // a和b都能正常输出
foo();
//console.log('c= '+c); // 即使 执行了一次foo()函数, 但是还是会 报错: 变量c没有定义, 因为是局部变量
console.log('d=' +d); // 但是这个d就能输出了 因为在函数内部, 如果不加var 就表示它是一个 "全局变量"!
</script>
给jquery添加自定义的函数扩展?
- jquery为开发插件 提供了 两个扩展, 一个是 \(.fn.extend(object), 一个是\).extend(object)
-
上面的$ 也可以写作为 jQuery, 即$ 是 jQuery的别名
-
jQuery.extend(..)可以看作是 jquery的类 的静态方法 扩展, 使用时, 要用 $/jQuery 来引用/调用;
-
jQuery.fn.extend(...) 可以看作是 jQuery类 的 实例化的 成员方法 扩展, 使用时, 要用 jquery的实例化 对象 == 即 一个实际被选中的dom对象来 调用它.
-
注意extend的参数 , 本来 extend的原型是: extend(dest, src1, src2, ...) 意思是将多个 js对象 合并到第一个dest 参数, 并且返回合并后的 dest对象.. 如果 dest省略, 则合并到jquery的全局对象中去. 所以, 总之, extend的参数, 都是 js对象, 要采用 {foo: function()...} 的方式来写, 而不是 像 传统语言的 传入两个分离 的参数...
<script>
/** $.extend('warn', function(){ ** 这种写法就是错误的了, 不是传入分离的两个参数, 而是传入一个js对象 格式的一个参数: $.extend({ warning: fucntion(){...}}) 才是正确的*/
// 给 jquery类扩展 静态方法:
$.extend({warning: funtion(jo){
alert(this.innerHTML); // 这里将会出错!!!
jo.prepend("<h1 style='color: red; fontSize: +.5em; border: 2px solid yellow;'> Warning: something goes wrong! </h1>");
}});
// 简略的写法, 直接就是 : jQuery.warning = function(){....}
</script>
</head>
<body>
<div>
<p>
<span class="sp1">第一个span</span>
<span id="sp2">第二个span</span>
<span style="color:red" class="sp2">第三个span</span>
</p>
<p><a href="javascript:viod(0);"> test</a></p>
</div>
<script>
$('a').click(function(){
$('span:not(".sp1 .sp2")').html('<b>test</b>').css('border', '2px solid gold');
jQuery.warning( $('body') ); // <font color="red"> 这个地方 不能使用 $(document) , 不知道为什么? </font>
});
</script>
说明:
-
在$.extend的定义中, 就不能再使用 $('selector') , 不能对你传递进去的 字符串 进行 包装了, 因为, 它是找不到 相应的 dom元素对象的,
-
在$.extend () 全局方法中, 你是 可以使用 jquery对象的, 但是所以 必须对参数 或传递进来的都应该是已经包装好的 jquery对象了. 也就是说, $.extend 中可以使用实际的dom/jquery对象, 但是 必须是 外部已经包装好的对象.
-
如果是 在 $.extend({funcName: function(jo){...}); 中 使用 ｔｈｉｓ，要注意 这里的this, 并不是指的 你传递进去的这个参数 表示的html元素对象或包装的jquery对象, 而是指的这个 funcName 这个所指向的函数: 因此, 在 这个里面你 用this 是 取不到元素的, 也是没有多大意义的:
-
但是 在 $.fn.extend()中就可以随意的 使用 this, 这时候的this, 就是指的 当前html元素对象了.
$.extend({warning: function(jo){
alert(this.innerHTML); // 这个将会导致 浏览器js 崩溃 ,解析晕头?m(a,b)
console.log(this); // 这个输出的是: function m(); 调试器中显式的 this -> m(a, b)
console.log(typeof this); // 这个输出的是 function 所以 this 指的是 一个function.
================================================
注意静态存在元素 和 后来才动态添加的元素 , 在使用(绑定)一些方法的时候, 有一些区别.
- 比如click只能使用在一开始就静态存在的元素上, 不能使用在动态添加的元素上
- 要在动态添加的元素上, 需要使用 onclick属性,
- 在动态添加的元素上,绑定事件, 需要用live, 不能用on和bind(on/bind只能用在静态元素上)
链接的onclick和href的区别 还有 click 方法, 它们之间究竟有什么关系?
-
在这三者中, 首先是 链接的onclick 事件被先执行， 然后是 链接元素的 click (jquery封装的方法) 被执行, 最后, 才是 href属性下的动作（页面跳转，或 javascript 伪链接）；
-
假设链接中同时存在href 与onclick，如果想让href 属性下的动作不执行，onclick 必须得到一个false的返回值；
-
如果页面过长有滚动条，且希望通过链接的 onclick 事件执行操作。应将它的 href 属性设为 javascript:;，而不要是 #，这可以防止不必要的页面跳动；注意, # 表示一个默认的锚点, 即#top是文档的最顶端
-
如果在链接的 href属性中调用一个有返回值的函数，当前页面的内容将被此函数的返回值代替； 因为href的意思和本来作用, 就是 跳转到 href指定的内容中去.
**http用到 的操作只有 get/post/put/delete四种操作??? **
- get用来 获取资源, post用来新建(也可以用于更新)资源, put用于更新资源, delete用于删除资源
- 注意, 这里的get和post 不同于/不是 表单的 get和post方法.
**在mvc的好处是在 较大的项目/较多的文件时, 会体现出来. 易于维护, 条理清晰, 避免"踩坑", **
- 在框架中, 应该给 数据表 的 字段 创建 映射, "直接显示字段/不隐藏字段" 是危险的, 就像"裸奔". 而且sql注入, 不是人工来攻击, 而是采用计算机程序进行扫描和暴力破解!
关于 click和 onclick的区别?
- onclick是 html元素的 原生的 "事件属性", 注意是一个 属性, 所以给它赋值时, 是一个 表示 事件处理函数的 函数名"字符串" 不能带括号, 因为凡是带括号的都表示是一个函数.
- click 则是"事件", 只有在jquery 中有用, 所以你不能直接 给html元素指定 click属性的! 它是jquery对 onclick属性 click事件 的一个封装. 执行 元素的.click方法时, 将会 触发元素的 onclick事件, 当然就会执行绑定到onclick 上的函数.
转变为函数表达式的方式有两种, 一种是 在闭包外面加 小括号（），注意是小括号, 而不能用大括号。 另一种方式是: 使用! ~, -, + 等运算符, 同样可以将函数声明变为函数表达式.... 但是 要注意 特殊符号有副作用!
-
所以
var foo= fuck(); 这个foo将等于fuck函数 **执行后**的返回值, 如果没有返回值, 将等于 undefined, (**正确: undefined, 既是一个值, 又是一种类型! **) 而var foo2=fuck; 那么foo2将等于fuck函数的定义字符串. -
所以, 加不加括号, 关键是要看 这个 是放在哪个位置的, 如果是放在 元素标签里面的onclick后面的话, 那么 表示 在元素被单击时 才要执行的代码 所以 这里要加上 括号, 否则不加括号是不会执行的 (经测试 ,是真的不会执行的!)
-
如果是放在 script标签中的话, 由于 在script标签载入的时候, 就要把里面的代码执行 一次, 所以, 如果你想 在目标元素被单击时才开始执行, 就不能加函数名后面的括号, 否则, 括号表示 一载入 script就会执行 只是把执行后的结果返回值给 前面的变量, 这样即使没有单击元素, 也会执行函数. 这个显然不是我们想要的 比如下面的代码就是这样:
<script>
function fck(){
alert('something');
return 10;
}
</script>
<script>
var v1=fck(); // 这里, 即使没有任何触发, 也会在页面载入时, 就 直接执行 fck()函数了, 而且 v1 就被赋值了, 是10
var v2=fck; // 而v2 是一个函数, 输出 function v2()
console.log(v1);
console.log(v2);
console.log(v2 + 'v2 type: ' + typeof v2) ; // 这里 将是一个字符串, 真的会将 v2的函数字符串 literal 显示出来.
</script>
＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
alert是window的方法, 是模式对话框, 所以 总是 先执行它, 解除阻塞后, 再执行 其他css效果!
// 为什么总是先执行 alert语句， 然后才执行其他内容语句？
// 而为什么alert之后就好用了呢？因为alert执行的时候，在等待用户确认的这个过程中，程序是被阻断的，不会向下执行，但是页面的加载过程却不中止，这就相当于页面加载并解析的时间，被alert给留下来了，如果用户的手快，而网络速度很慢的话，同样也会报错，并不执行
// 执行和加载 过程是两个不同的过程! (意思是: 当js被阻塞的时候, 页面的加载 还是会继续! ????)
==================================
关于href="javascript:..." 后面的几种写法?
-
如果写成: javascript: void(0); 可能在js调试控制台 报错: Error: ReferenceError: void is undefined function. 这是因为, js真的将 void ()因为有小括号嘛, 当做了一个函数. 这个函数的参数是0, 而这个函数void 确实是没有 定义. 由此推广, 可知, 任何一个 不存在的函数, 都可以放在 javascript: 的后面, 都是起到同样的效果.
-
各种链接a的href的写法的不同:
- 必须写href属性, 否则a标签 不能判断你是要跳转 还是要定义锚点.所以 就不会显示 手型标记.
- href可以是空串. (意思就是 默认跳转到当前文档 ), 将会跳转到 当前文档的 最顶端. 类似于 form表单的 action="", 将会 重新载入当前文档
- 可以是js 代码的 "伪链接" 即
href="javascript:...." - 这个javascript: 后面的写法:有很多种
- 可以是空, 什么都没有 , 或者只是一个 分号, 都是可以的, 表示这个伪链接, 就是执行这个 js, 就完了. 因此不会也不会产生什么 页面的跳动. 但是要注意必须有 javascript后面的冒号, 如果没有冒号, 会把javascript当做是一个 模块..而出错
- 可以是多个任意的 / 合法的 js语句, 比如: 甚至可以是这样的
<p><a href="javascript: var v=10; alert(v); ">test</a></p>, 但是, 这些js语句不能包含 return语句, 因为return语句只能放在函数中, 所以会报错 : SyntaxError: return not in function. - javascript: 后面可以是函数名调用. 要注意的是, 这里的函数名 要带上小括号(), 才表示要执行这个函数, 如果函数有返回值, 则当前页面将被替换为函数的返回值, 如果不带小括号, 则 js引擎将扫描script标签, 看哪些是函数名, 所以 将会用 函数的定义 字符串(literal纯文字性的内容) 所替换.
关于 锚点a的定义和应用
-
a的使用包括两个方面, 一个是 跳转, 另一个是 定义
-
链接的跳转a, 不管是本文档内, 还是外部(即其他文档,不是当前文档 ), 都是使用 href属性来指定, 如果是外部链接, 则直接书写, 如果是本文档内则 要用 井号 # 表示.
-
而链接的定义, 实际上, 就是在文档内, 创建一个标签(位置标签) 有两种方式可以创建标签 , 一种是使用 id 来标记, 这时可以针对任何html元素标签,
即p, span, div 等, 只要定义了 html元素的id, 那么就创建了一个 文档内部的锚点; 第二是使用 a标签的 name属性, (即a锚点的名字) 要注意, 如果使用name
属性, 那么就只能使用 a 元素标签, 而不能使用其他元素. 即只能是<a name="some-anchor">这里定义了一个锚点</a> -
要注意, 不能对 html元素, 使用 anchor属性来定义锚点.
-
使用
<a href="#anchor"> some anchor </a>跳转到锚点的时候, 页面的光标(焦点)总是在这个锚点位置的第一列. 当然不一定锚点位置将总是出现窗口的 最顶端处.
delegate, live , on,bind, one off , unbind....??
delegate, 是委派, 委托的意思, 相当于 assign, 委任的意思, 只有 上级才能 委派/委托下级, 相应的, 就是 父元素 委派/委托 子元素的事件.
函数格式是: $('父元素'). delegate($('父元素所包含的子元素'), '委派的事件类型, 比如click', 相应的处理函数)
delegate就如同 live, 将事件绑定到 根元素, 并不像(bind, 只是绑定到特定的某一个 元素), 所以, 在后来动态 添加的 子元素 也会相应的被委派绑定 相应的事件.
-
live函数, 被新的版本, 好像已经被废弃和停止了, 被代替的是用: delegate.
-
on和bind的区别: 两者基本上是一致的,都可以一次性的绑定多个事件. 只是 on方法 中多了一个 selector 过滤选择器(对子元素进行过滤). 两者的
分水岭是jquery的 1.7 的版本, 在 1.7之前, 是bind, 在1.7后, 推荐使用on方法. -
重要的是, bind和on都不能 对动态增加的 节点使用绑定方法. 动态节点, 必须使用 delegate方法.
-
one方法是 绑定到目标元素上的事件 只执行一次! 然后就自己销毁 了. 而bind和 on函数 可以重复执行多次, 一直都存在...
单击图片, 在新的页面打开/显示图片的代码: 是 给图片外 包裹一个 a 链接标签, 其中, a的target="_blank", href="就是图片的src地址"
指定一个没有确定意义的, 无意义的函数名, 可以使用 blah: 吧拉黑, blah[bla] 其中的h没有发音, 意思是: "废话, 胡扯..."
关于事件的传播, 冒泡: 参考: https://kb.cnblogs.com/page/94469/
- dom的最顶层的节点是window>document>...通常认为dom的根节点是 document
- 事件的传播, 理解: 如同 盒子里放一本书,你用力打一下书 实际上, 盒子也受到了打击, 如同瓶子里装水, 你用棍子使劲打水, 实际上也打了瓶子, 有可能瓶子也会被打坏. 事件的传播如同 "力的 传播" 一样, 因为 你在父元素之内嘛, 你受到单击的事件时, 自然的 父元素也是会受到单击事件的.
举个例子:
<p>some other in paragraph <a href="javascript: (function(){alert('t');})() " > 测试 </a></p>
<script>
$('a').click(function(){
alert('you click "a"');
});
$('p').click(function(){
alert('you click p');
});
</script>
// 此时, 当单击链接 a的 时候, 会依次弹出: click a, 然后弹出 click p. 这里的click p 就是事件 冒泡到 p标签而触发的! 事件冒泡是js默认的 传递方式, 不需要 任何设置!
-
bind是直接绑定到 确定元素上的. 而
$('a').live('click', function(){alert('some')});live 其实 是 绑定到 dom的根节点上的. 这里的a节点和 事件参数 click 只是 作为函数, 传递的. delegate 也是绑定到 某个元素上, 对其后代元素起作用的 -
其实live 和 delegate的执行过程, 根binnd的执行过程不同: bind是直接就执行了: 而 live和delegate并不是马上执行的, 它总是 要等到: 事件冒泡 到 document 或 调用delegate的元素上时, 才开始检查的: 检查 当前冒泡事件是不是指定type的事件, 比如click, 然后检查扫描 各个节点元素 是不是指定的 'a'或子节点, 如果是则 开始执行后面的事件响应处理函数. ..(所以, live和delegate方法, 能够处理后来 /动态添加的 节点元素, 因为它们 是从 父节点, 或dom根节点开始扫描的).
-
所以, live和delegate的处理过程是类似的,
可以认为: $('a').live(....) 等于 $(document). delegate('a', ....)$但是 更愿意使用delegate , 因为delegate的效率更快更好, 扫描/存储的 jquery对象更少. -
而且好像 live函数被废弃了???
**js是单线程的, 所以, 一旦发生错误, 如果没有异常处理机制, 就会被阻塞, 后面的代码都没有机会执行! **
======================================
tp并没有提供 地址数据文件, 比如: qqwry.dat 或 UTFWry.dat 文件. 只是提供了 \Org\Net\IpLocation.class.php的类. 因为定位数据文件是较大的, 约 4~5MB. 肯定不能被打包在tp的软件包里面.
wry: [rai] 这里的w没有发音 : 嘲讽的, 讽刺的, 牵强的.... there is a wry of sense of humor in his work. work: 除了工作外, 还有 "著作, 作品"的意思.
