javascript

一些javascript处理字符串的常用方法。

懒得每次都查找，在这里整理一下。

split() 方法
功能：使用一个指定的分隔符把一个字符串分割存储到数组
例子：
str=”jpg|bmp|gif|ico|png”;
arr=str.split(”|”);
//arr是一个包含字符值”jpg”、”bmp”、”gif”、”ico”和”png”的数组

join() 方法
功能：使用您选择的分隔符将一个数组合并为一个字符串
例子：
var myList=[”jpg”,”bmp”,”gif”,”ico”,”png”]
var portableList=myList.join(”|”);
//结果是jpg|bmp|gif|ico|png

substring() 方法** 功能**：字符串截取，比如想从”MinidxSearchEngine”中得到”Minidx”就要用到substring(0,6)

indexOf()
功能：返回字符串中匹配子串的第一个字符的下标
var myString=”javascript”;
var w=myString.indexOf(”v”); //2
var x=myString.indexOf(”S”); //4
var y=myString.indexOf(”Script”); // 4
var z=myString.indexOf(”key”); // -1(不存在)

javascript

get方式在ajax中导致中文乱码问题的一些原因。

以前一直用get方式提交数据，对get和post方式并没有太深入研究，今天在一个项目中遇到了中文乱码问题如下：


第一列是通过get方式提交的内容，提交到服务器后，取回来写入页面时是乱码，而第二列我换成post方式提交，问题解决。

后来在查了一下资料，对这两种方式的乱码问题有了进一步了解，原来对于get请求（或凡涉及到url传递参数的），被传递的参数都要先经encodeURIComponent方法处理.如果没有用encodeURIComponent处理的话,也会产生乱码。

Read More

CSS

通过IE私有滤镜让IE6 7 8支持背景透明，内容不透明效果。

CSS3已经支持背景rgba的rgba透明度，这一方法可以避免元素内容也随背景一起变透明(详情请阅/css3-new-knowledge-student)。但是这一属性在低于IE9的版本中却不被支持，我们可以通过IE私有滤镜来实现背景透明效果。
rgba参数格式：(red,green.,blue,alpha),alpha值0-1。
ie滤镜参数#3363370b，前两位为16进制透明度，比如说值是上面用到的0.2，那么就是0.2×255＝51，再转换成16进制为33。
至于10进制转换16进制，请查阅js函数toString(16)

<style type="text/css">
body{ background:url(http://gg.blueidea.com/2011/phpchina/phpchina_ad.gif)}
#d1{width:300px; margin:100px auto; padding:50px;background:rgba(99, 55, 11, 0.2)}
p{background-color:#fff; color:#000}
#d2{background-color:#fff; width:600px; margin:0 auto; padding:10px; line-height:30px}
</style>

<div id="d1">1、背景透明内容不透明<p>2、背景透明内容不透明</p></div>
<div id="d2">
没有什么好解释的，rgba参数(red,green.,blue,alpha),alpha值0-1<br></br>
ie滤镜参数#3363370b，前两位为16进制透明度，<br></br>
比如说值是上面用到的0.2，那么就是0.2×255＝51，再转换成16进制为33<br></br>
至于10进制转换16进制，请查阅js函数toString(16)
</div>

如果懒惰的童鞋，可以使用下面的自动生成工具：
/wp-content/uploads/2012/09/background-color-opacity.html

CSS

CSS Sprites: 有用的技术, 还是潜在的麻烦?

啊，无处不在的CSS Sprites——为数不多的网页设计技术，几乎瞬间，被评为最佳实践的CSS类之一。

今天大多数Web开发人员都掌握了这种技术，并有过无数的教程上写的文章。几乎在每一个教程，都提出设计者和开发者应该使用CSS Sprites，为了尽量减少HTTP请求，并节省了宝贵的流量。这项技术迄今已被许多网站采取，包括现在使用大型Sprites的亚马逊。

在这篇文章中，我将讨论的一些使用CSS sprites的优点和缺点，特别是对重点使用的“巨无霸型”的Sprites，为什么这些使用的Sprites在很多情况下是在浪费时间。

Read More

CSS

CSS3新属性基础学习

嗯，这里是是CSS3一些新的属性基本知识：文字阴影，盒阴影，边界半径。这些CSS3属性常用来加强布局和实现良好的效果：

RGBA
前三个值是RGB颜色值和最后一个值是水平的透明度（0 =透明，1 =不透明）。

RBGA可应用于任何与颜色相关的属性如字体颜色，边框颜色，背景颜色，阴影的颜色，等

Read More

CSS

让IE6支持max-width, max-height属性

max-width, min-width, max-height 和 min-heigh是CSS2的属性，它工作于IE7以及更高版本和或者Mozilla Firefox、Chrome等支持CSS2的浏览器，但不能与IE 6和更低版本IE浏览器兼容。

比较常用的解决方案是通过CSS表达式让IE6实现相同的效果。

例如：如果你有一个或多个图像，显示图像的高度和宽度应该有一些限制。即图像不应该有宽度超过500px（假设），高度不超过200px，那么图像的CSS应为如下：

img.thumb{
max-height:200px;
max-width:500px;
width:expression(document.body.clientWidth > 500? “500px”: “auto” );/*for ie6*/
height:expression(document.body.clientHeight > 200? “200px”: “auto” );/*for ie6*/
}

Read More

CSS

javascript修改className在firefox中无法加载新class的样式问题

在制作外语版的文章页的项目过程中，我们常常会遇到这样一个需求：每一篇文章的首个字母加粗并大写。这点在CSS中用:first-letter伪类即可实现。但是由于使用的是cms系统，内容部分代码后台动态生成，我们只知道包含内容的一个DIV的ID,假设这个DIV的ID为conBox,我采取了通过JS获取此div#conBox下面第一个p元素，并修改其class为first,为p.first:first-letter伪类添加样式.

Read More