JSON字符串与JSON对象的区别

JSON字符串与JSON对象的区别

本篇文章是对javascript、js操作json方法总结 http://www.haorooms.com/post/js_jsons_h 这篇文章的补充说明,有朋友问JSON字符串与JSON对象的区别,下面说一下。

JSON对象是直接可以使用JQuery操作的格式,和js中的对象一样,可以用对象(类名)点出属性(方法)。

JSON字符串仅仅只是一个字符串,一个整体,不截取的话没办法取出其中存储的数据,不能直接使用,除非你只想alert()他;

JSON对象:

var str2 = { "name": "haorooms", "sex": "man" };

JSON字符串:

var str1 = '{ "name": "haorooms", "sex": "man" }';

"JSON字符串"转化为"JSON对象"

请看http://www.haorooms.com/post/js_jsons_h

jQuery Ajax 操作函数温故而知新

引子

今天准备对前段时间做的微信页面进行数据绑定,数据格式大多是json格式的,还有对数据的搜索和查询。初步定的做法是先将数据缓存到本地,然后对本地的json数据进行查询,对于json数据的查询,我找到了一个JsonSQL的方法,就是用类似SQl的方式的方式查询json数据。【对于这种方法,今天稍微看了一下,很不错,但是还没有应用于实践,等后面再对JsonSQL做具体的介绍。】当我看jsonsql的时候,我发现用的是ajax的getJSON方法,对于jquery的getJSON方法及POST()还有GET()等等方法,我是了解的,但是没有经常的使用,因此有些生疏,所以,今天对jQuery Ajax 操作函数温故而知新一下!

jQuery Ajax,我常用的调用方法

             $.ajax({
                     'url': 'url.php',
                    'type':'get',//或者POST
                    'datatype':'json',//或者"jsonp",或者script等等
                    'data':{
                            q : q,
                            b : b,
                            v : v,
                            c : c
                    },
                    //'jsonp': 'jsonpcallback',有时候也用,在跨域调用的时候
                'success':function(d){
                        console.dir(d);
                },
                'error':function(d){
                        console.dir(d);
                },
     });

我经常用上面这种方法进行ajax调用,这种方法很方便,可以说是打遍天下无敌手!

但是也有很多简单的调用方式,下面我介绍一下!

jQuery Ajax 其他调用方法

jQuery ajax - getJSON() 方法

这种方法相当于

$.ajax({  
  url: url,   
  data: data,
  dataType: json,
  success: callback
});

语法如下:

jQuery.getJSON(url,[data],[callback])

参数            描述
url         待载入页面的 URL 地址。
data     待发送 Key / value 参数。
callback    载入成功时执行的回调函数。

案例:

$.getJSON("test.js", { name: "John", time: "2pm" }, function(json){  
  alert("JSON Data: " + json.users[3].name);   
});

php开启openssl的方法,openssl安装

什么是openssl?

关于openssl,我说的不如百度百科齐全,还是看看百度百科的解释吧!http://baike.baidu.com/view/300712.htm

php开启openssl的方法,大多数情况下openssl是没有开启的,要想启用需要进行下简单的设置:

windows下开启方法:

1: 首先检查php.ini中;extension=php_openssl.dll是否存在, 如果存在的话去掉前面的注释符‘;’, 如果不存在这行,那么添加extension=php_openssl.dll。

2: 讲php文件夹下的: php_openssl.dll, ssleay32.dll, libeay32.dll 3个文件拷贝到 WINDOWS\system32\ 文件夹下。

3:如果没有 php_openssl.dll ,点击下载 php_openssl.dll

下载下来有很多个php_openssl,找到你相应php版本下面的php_openssl。

查看php版本可以用如下代码:

<?php
phpinfo();
?>

找到相应版本之后,按照上面讲的第二步来就可以了。

4: 重启apache或者iis

至此,openssl功能就开启了。

Linux下开启方法:

我使用的是阿里云ECS,PHP版本:php-5.5.7

CSS3的nth-child() 选择器,表格奇偶行变色

nth-child() 应用背景

CSS3的nth-child() 选择器,我之前很少用,在做表格偶数行变色的时候,我通常在绑定的时候,做一个js判断,来加一个css,从而使表格偶数行和奇数行颜色不一样。这样的兼容性很好。但是最近在做手机网站的时候,由于手机网站对浏览器兼容要求相对较低,手机浏览器大部分都支持css3,这就大大提高了开发效率。可以随意使用CSS3 :nth-child()伪类选择器。

nth-child()浏览器支持

IE9及以上版本,火狐,谷歌,Safari ,Opera都支持!

定义和用法

:nth-child(n) 选择器匹配属于其父元素的第 n个子元素,不论元素的类型

n 可以是数字、关键词或公式。

例如:

p:nth-child(2)
{
background:#ff0000;
}

<body>

<h1>这是标题</h1>
<p>haorooms第一个段落。</p>
<p>haorooms第二个段落。</p>
<p>haorooms第三个段落。</p>
<p>haorooms第四个段落。</p>

</body>

上面这段代码请问那个段落颜色是红色的?

答案是“haorooms第一个段落。”颜色变成了红色!

js利用offsetWidth和clientWidth来计算滚动条的宽度

大家好,十一小长假结束了。。相信大家玩的都很开心,还没有尽兴!好多网友期盼祖国母亲再过一次农历生日呢!!!哈哈哈哈!言归正传,今天我主要介绍一个计算滚动条宽度的例子。

前言

其实,很多情况下滚动条宽度是不用计算的,特别是谷歌浏览器,可以对滚动条进行美化,具体请看http://www.haorooms.com/post/CSS_selections 这里例子,已经定义了滚动条的宽度是9px加上padding-left的一个像素,所以滚动条的宽度应该是10px,但是,这样计算出来有浏览器兼容问题,你的IE浏览器的滚动条宽度不一定是10px,今天,我用offsetWidth和clientWidth来计算一下滚动条的宽度。

占位方式

在PC浏览器中,滚动条是占位元素的内边距和内容区域的;而在移动浏览器中,滚动条是不占用内边距和内容区域,并且还及时显隐。因此,只需要在在PC浏览器中计算滚动条的宽度,尤其是在全屏弹窗不可滚动的情况中。

offsetWidth-clientWidth方法

说到offsetWidth和clientWidth,不少朋友迷茫了,这个宽度是什么意思呢?http://www.haorooms.com/post/js_jquery_height 这篇文章洪有关javascript的各种高度,介绍了offsetWidth和clientWidth等等的意思,大家可以看看!!

function getScrollbarWidth() {
    var oP = document.createElement('p'),
        styles = {
            width: '100px',
            height: '100px',
            overflowY: 'scroll'
        }, i, scrollbarWidth;
    for (i in styles) oP.style[i] = styles[i];
    document.body.appendChild(oP);
    scrollbarWidth = oP.offsetWidth - oP.clientWidth;
    oP.remove();
    return scrollbarWidth;
}