Jquery And JavaScript

JavaScript And JQuery

一、Json数据格式转换

1.、将服务器端构建好的JSON数据转化为可用的JavaScript对象

    var jsonObject=eval ("("+ jsonFormat+")");

加上圆括号的目的是迫使eval函数在评估JavaScript代码的时候强制将括号内的表达式（expression）转化为对象，而不是作为语句（statement）来执行。举一个例子，例如对象字面量{}，如若不加外层的括号，那么eval会将大括号识别为JavaScript代码块的开始和结束标记，那么{}将会被认为是执行了一句空语句。所以下面两个执行结果是不同的：

alert(eval("{}");// return undefined
alert(eval("({})");// returnobject[Object]

2、JSON格式的名字部分为什么要加引号？

因为eval函数会将{foo:”bar”}解释成合法的JavaScript语句，而非表达式。但是人们往往想要的是让eval将这段代码解释成一个对象。所以JSON格式会强制你去在名字的外侧加上引号再结合圆括号，这样eval就不会错误的将JSON解释成代码块。

举例说明

eval错误解析语义

        alert(eval('{foo:"bar"}'));  // return "bar", incorrect

eval正确解析JSON

alert (eval ('({"foo": "bar"})'));// return JSONobject, correct

 

二、函数

1、 replace

var star=”2015-1-1”

str.replace(/-/, “/”) 只替换一个 结果2015/1-1

 

str.replace(/-/g, “/”) 全局替换  结果2015/1/1

或者

var reg=new Remex (“-”,” g”);

str. replaces(reg,”/”);

注：replace All为JQuery的方法替换元素

     2.$.trim()  去掉字符串首尾空白字符

       isNaN() is not a number 不是数字？  True不是数字  false是数字

 

JQuery and JavaScript 节点操作

1. 通过顶层document节点获取：

        （1）document.getElementById(elementId) ：该方法通过节点的ID，可以准确获得需要的元素，是比较简单快捷的方法。如果页面上含有多个相同id的节点，那么只返回第一个节点。

      

        （2）document.getElementsByName(elementName) ：该方法是通过节点的name获取节点，这个方法返回的不是一个节点元素，而是具有同样名称的节点数组。然后，我们可以通过要获取节点的某个属性来循环判断是否为需要的节点。

例如：在HTML中checkbox和radio都是通过相同的name属性值，来标识一个组内的元素。如果我们现在要获取被选中的元素，首先获取改组元素，然后循环判断是节点的checked属性值是否为true即可。

 

       （3）document.getElementsByTagName(tagName) ：该方法是通过节点的Tag获取节点，同样该方法也是返回一个数组，例如：document.getElementsByTagName('A')将会返回页面上所有超链接节点。在获取节点之前，一般都是知道节点的类型的，所以使用该方法比较简单。但是缺点也是显而易见，那就是返回的数组可能十分庞大，这样就会浪费很多时间。那么，这个方法是不是就没有用处了呢？当然不是，这个方法和上面的两个不同，它不是document节点的专有方法，还可以应用其他的节点

 

 

2、通过父节点获取：

      （1）parentObj.firstChild ：如果节点为已知节点（parentObj）的第一个子节点就可以使用这个方法。这个属性是可以递归使用的，也就是支持parentObj.firstChild.firstChild.firstChild...的形式，如此就可以获得更深层次的节点。

 

      （2）parentObj.lastChild ：很显然，这个属性是获取已知节点（parentObj）的最后一个子节点。与firstChild一样，它也可以递归使用。

 

      （3）parentObj.childNodes ：获取已知节点的子节点数组，然后可以通过循环或者索引找到需要的节点。

注意 ：经测试发现，在IE7上获取的是直接子节点的数组，而在Firefox2.0.0.11上获取的是所有子节点即包括子节点的子节点。

 

      （4）parentObj.children ：获取已知节点的直接子节点数组。

注意 ：经测试，在IE7上，和childNodes效果一样，而Firefox2.0.0.11不支持。这也是为什么我要使用和其他方法不同样式的原因。因此不建议使用。

 

      （5）parentObj.getElementsByTagName(tagName)：它返回已知节点的所有子节点中类型为指定值的子节点数组。例如：parentObj.getElementsByTagName('A')返回已知的子节点中的所有超链接。

 

3、通过临近节点获取：

     （1）neighbourNode.previousSibling：获取已知节点（neighbourNode）的前一个节点，这个属性和前面的firstChild、lastChild一样都似乎可以递归使用的。

     （2）neighbourNode.nextSibling：获取已知节点（neighbourNode）的下一个节点，同样支持递归。

4、通过子节点获取：

     （1）childNode.parentNode ：获取已知节点的父节点。

 

 

2、.Jquery获取节点

 

jQuery.parent(expr) 找父亲节点，可以传入expr进行过滤，比如$("span").parent()或者$("span").parent(".class")

 

jQuery.parents(expr),类似于jQuery.parents(expr),但是是查找所有祖先元素，不限于父元素

 

jQuery.children(expr).返回所有子节点，这个方法只会返回直接的孩子节点，不会返回所有的子孙节点

 

jQuery.contents(),返回下面的所有内容，包括节点和文本。这个方法和children()的区别就在于，包括空白文本，也会被作为一个

 

jQuery对象返回，children()则只会返回节点

 

jQuery.prev()，返回上一个兄弟节点，不是所有的兄弟节点

 

jQuery.prevAll()，返回所有之前的兄弟节点

 

jQuery.next(),返回下一个兄弟节点，不是所有的兄弟节点

 

jQuery.nextAll()，返回所有之后的兄弟节点

 

jQuery.siblings(),返回兄弟姐妹节点，不分前后

 

jQuery.find(expr),跟jQuery.filter(expr)完全不一样。jQuery.filter()是从初始的jQuery对象集合中筛选出一部分，而jQuery.find ()

 

的返回结果，不会有初始集合中的内容，比如$("p"),find("span"),是从

 

p元素开始找,等同于$("p span")

 

 

Window.onload=function(){}

$(document).ready(function(){})

 

Ajax请求几种写法

$.get("demo_test_post.asp?name="+Donaldduck+”&city=”+Duckburg,

  function(data,status){

    alert("Data: " + data +"\nStatus: " + status);

  });

 

或

$.get("demo_test_post.asp",

  {

    name:"Donald Duck",

    city:"Duckburg"

  },

  function(data,status){

    alert("Data: " + data +"\nStatus: " + status);

  });

 

$.post("demo_test_post.asp",

  {

    name:"Donald Duck",

    city:"Duckburg"

  },

  function(data,status){

    alert("Data: " + data +"\nStatus: " + status);

  });

 

 

 

 

 

$.ajax(

        async:true(异步（默认）)/false(同步)

       url:””,

       data:{s1:””},

       type:”get/post”,

       dataType:”json/text/xml”,

       success:function(obj){

       }

})

 

Js倒计时写法

//60秒后获取验证码

var countdown=60;

function settime(obj){

       varsendSmsObj=$("#sendSms");

       if(countdown==0){

              obj.attr("href","javascript:sendSms()");

              obj.text("发送验证码");

              countdown=60;

              return;

       }else{

              obj.attr("href","javascript:void()");

              obj.text(""+countdown+"秒后获取");

              countdown--;

       }

       setTimeout(function(){settime(obj)},1000)

}

 

 

closest会首先检查当前元素是否匹配，如果匹配则直接返回元素本身。如果不匹配则向上查找父元素，一层一层往上，直到找到匹配选择器的元素。如果什么都没找到则返回一个空的jQuery对象。

closest和parents的主要区别是：1，前者从当前元素开始匹配寻找，后者从父元素开始匹配寻找；2，前者逐级向上查找，直到发现匹配的元素后就停止了，后者一直向上查找直到根元素，然后把这些元素放进一个临时集合中，再用给定的选择器表达式去过滤；3，前者返回0或1个元素，后者可能包含0个，1个，或者多个元素。

closest对于处理事件委派非常有用。

1.$('#items1').closest('.parent1');

JSON.Parse

js拼接字符串后通过ajax 传后端

var s={"a":1,"b":2}   定义的s就是json对象  直接赋值

当值多时，拼接成的

var s="{";

s+=''............

此时的s就是字符串。传值时 通过 JSON.parse(s) 转成json对象