tp框架中的一些疑点知识-7

  1. 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对象区别对比表

821299-20180507170727704-275091505.png

总而言之你可以理解为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

  1. jquery的val方法?
  • 它是用来获取/设置 具有value属性的元素的值 的, 要注意, 只有 元素具有value属性的, 才能使用这个方法有效.否则无效.
  • val只是用来获取value值, 并不会向元素添加 value=...这样的属性, 要真正的向元素写上value属性, 要用 attr('value', ...)方法.

  • 因为通常只有 form 表单元素才有 value属性, 所以我们经常看到的是, val()方法 都只在 form表单元素上使用.

===============================

  1. jquery选择器的返回值, 有两种情况:
    • 如果是多个元素, 则返回一个 数组: 由html元素组成的 <模板>数组: 即: Array<Element(s)>
    • 如果是返回的一个对象, 则是 jQuery对象

掌握jquery选择器 (不包括筛选方法) 分为基本选择器 , 和 过滤选择器,

  1. 过滤选择器,除了属性过滤外,都是用冒号(:)来表示选择过滤的. 主要包括:
    - 表单过滤器,用类型来过滤, 比如 :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
    • 内容选择器....

==== ========================================

  1. 区分两个概念:
  • 后代基本选择器中的 “祖先 后代", 是指一个标签元素下的 各个子级的元素都算. 祖先是指各个元素的 只要是它前面的 所有各个级别的 祖先元素都算.
  • 父子元素: 是指一个标签元素后的 最近一级 的子元素. 和父元素.

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, 表示此变量是局部变量, 只在函数内有效; 如果不加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添加自定义的函数扩展?
  1. 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>

说明:

  1. 在$.extend的定义中, 就不能再使用 $('selector') , 不能对你传递进去的 字符串 进行 包装了, 因为, 它是找不到 相应的 dom元素对象的,
  2. 在$.extend () 全局方法中, 你是 可以使用 jquery对象的, 但是所以 必须对参数 或传递进来的都应该是已经包装好的 jquery对象了. 也就是说, $.extend 中可以使用实际的dom/jquery对象, 但是 必须是 外部已经包装好的对象.
  3. 如果是 在 $.extend({funcName: function(jo){...}); 中 使用 this,要注意 这里的this, 并不是指的 你传递进去的这个参数 表示的html元素对象或包装的jquery对象, 而是指的这个 funcName 这个所指向的函数: 因此, 在 这个里面你 用this 是 取不到元素的, 也是没有多大意义的:

  4. 但是 在 $.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 上的函数.

函数定义(== 声明) 和函数表达式的区别? 参考: https://blog.csdn.net/u012615439/article/details/79004875

  • 首先, 在js中的任何地方都可以定义/声明匿名函数, 但是函数要被调用, 才能生效执行
  • 其次, 函数调用的方式有很多种, 最明显的就是 显式的调用. 通过函数名来调用, 如:funcName();
  • 但是, 对于闭包函数的调用, 就不一样了: 有时候, 为了简洁, 还有一些隐式的调用, 比如匿名函数(闭包) 被声明后,马上就被调用: 这时候, 可以直接在匿名函数的最后面加 小括号. 但是, 由于是闭包调用, 不是 函数名调用, 所以, 要将闭包函数转变为 "函数表达式"
转变为函数表达式的方式有两种, 一种是 在闭包外面加 小括号(),注意是小括号,  而不能用大括号。 另一种方式是:  使用!  ~, -, + 等运算符, 同样可以将函数声明变为函数表达式.... 但是 要注意 特殊符号有副作用!  

理解onclick后面的函数要不要加括号? 很好的参考: https://www.zhihu.com/question/35788848?sort=created以前有很多误解和一知半解的地方, 这次是真的清楚了:

  • 首先你要知道, 在js中 函数名后面加不加括号, 的根本区别是什么, 这是问题最本质最根本的地方, 即: 加上括号后 就表示 要执行这个函数, 而且 要返回函数的值(假设函数最后有 return语句的话), 并把这个返回值 赋值给前面的变量. 反之, 如果不加括号, 表示的只是 这是函数体 本身 只是 literal 文字性的东西, 本身并没有被执行.
  • 其次, 函数名后面加上括号, 的用法表示调用 -> 执行该函数. 这个调用 不管是在 href 的js语句中, 还是在 script脚本标签中, 都是加上括号的.

  • 所以 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:..." 后面的几种写法?
  1. 如果写成: javascript: void(0); 可能在js调试控制台 报错: Error: ReferenceError: void is undefined function. 这是因为, js真的将 void ()因为有小括号嘛, 当做了一个函数. 这个函数的参数是0, 而这个函数void 确实是没有 定义. 由此推广, 可知, 任何一个 不存在的函数, 都可以放在 javascript: 的后面, 都是起到同样的效果.

  2. 各种链接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: 除了工作外, 还有 "著作, 作品"的意思.

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值