当前位置:  编程技术>WEB前端
本页文章导读:
    ▪推荐一个IE6下Png格式图片最佳透明解决方案      1.保存以下js文件,随便命名。var clear="images/clear.gif"; //path to clear.gifdocument.write('<script type="text/javascript" id="ct" defer="defer" src="javascript:void(0)"><\/script>');var ct=document.getElementById("ct");ct.onre.........
    ▪JavaScript数组和字符串的操作方法      一、数组(1)检测数组对于一个全局作用域来说,使用instanceof操作符可以检测某个对象是不是数组:if (value instanceof Array){ // }但如果网页中存在多个框架,实际上就存在多个不同的全.........
    ▪javascript学习笔记[4]--函数                 好了,现在开始函数这一章节,这之后就开始面向对象,加油吧,多看点。           4.1 内建的全局函数             jav.........

[1]推荐一个IE6下Png格式图片最佳透明解决方案
    来源:    发布时间: 2013-11-06

1.保存以下js文件,随便命名。

var clear="images/clear.gif"; //path to clear.gif

document.write('<script type="text/javascript" id="ct" defer="defer" src="javascript:void(0)"><\/script>');var ct=document.getElementById("ct");ct.onreadystatechange=function(){pngfix()};pngfix=function(){var els=document.getElementsByTagName('*'),ip=/\.png/i,al="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='",i=els.length,uels=new Array(),c=0;while(i-->0){if(els[i].className.match(/unitPng/)){uels[c]=els[i];c++;}}if(uels.length==0)pfx(els);else pfx(uels);function pfx(els){i=els.length;while(i-->0){var el=els[i],es=el.style,elc=el.currentStyle,elb=elc.backgroundImage;if(el.src&&el.src.match(ip)&&!es.filter){es.height=el.height;es.width=el.width;es.filter=al+el.src+"',sizingMethod='crop')";el.src=/blog_article/clear;}else{if/index.html(elb.match(ip)){var path=elb.split('"'),rep=(elc.backgroundRepeat=='no-repeat')?'crop':'scale',elkids=el.getElementsByTagName('*'),j=elkids.length;es.filter=al+path[1]+"',sizingMethod='"+rep+"')";es.height=el.clientHeight+'px';es.backgroundImage='none';if(j!=0){if(elc.position!="absolute")es.position='static';while(j-->0)if(!elkids[j].style.position)elkids[j].style.position="relative";}}}}};};

2.页面头部,引入此js文件。

<script type="text/javascript" src="/blog_article/你的命名文件.js"></script>

3.添加clear.gif到你的images 文件夹中.在js文件中,修改"var clear="images/clear.gif" 路径,为你存放clear.gif的文件路径.

这中间是【】clear.gif图片,1*1的非常小。

这样你的整个项目的png图片都实现了透明效果.的确非常简单吧?就3个步骤,就实现了整个站点所有png的透明效果.

本文链接


    
[2]JavaScript数组和字符串的操作方法
    来源:    发布时间: 2013-11-06

一、数组

(1)检测数组

对于一个全局作用域来说,使用instanceof操作符可以检测某个对象是不是数组:

if (value instanceof Array){
//
}

但如果网页中存在多个框架,实际上就存在多个不同的全局作用域,从而存在多个不同版本的Array构造函数。如果从一个框架向另一个框架传入一个数组,以上操作符便不起作用。ES5新增的Array.isArray()方法可以确定某个对象到底是不是数组,而不管它是在哪个全局作用域中创建的。

if (Array.isArray(value)){
//
}

 (2)转换方法

所以对象都具有toString()、valueOf()方法。调用数组的toString()方法会返回数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串。

而调用valueOf()方法返回的还是数组。

使用join()方法,可以使用不同的分隔符来构建由数组转换的字符串。它接受一个字符串参数,将其用作分隔符。默认为逗号。如果传入‘’,则将数组无素拼接起来,与字符串的+操作运算一样。

(3)栈、队列方法

push():接收任意数量的参数,把它们逐个添加到数组末尾,返回修改后数组的长度。

pop():不带参数,移除数组最后一项,并返回该项。

shift():不带参数,移除数组第一个项,并返回该项。

unshift():接收任意数量的参数,添加到数组的前端,返回新数组的长度。

(4)重排序方法

reverse():反转数组项的顺序,并返回修改后的数组。

sort():默认按升序排列数组项,并返回排序后的数组。它会调用每个项的toString()方法,然后比较得到的字符串,即使数组中每一项都是数字。

var num = [0,1,5,10,15];
num.sort();
console.log(num); // [0,1,10,15,5]

 因为这种情况,我们一般给sort()传一个比较函数作为参数:

function compare(value1, value2){
if (value1 < value2){
return -1; //这是升序的。可以交换-1和1,使结果降序。
} else if (value1 > value2){
return 1;
} else {
return 0;
}
}

 如果对于数值类型或者其他valueOf()方法会返回数值类型的对象类型,可以使用下面更简单的比较函数:

function compare(value1, value2){
return value1 - value2; //这是升序的。可以交换value1和value2,使结果降序。
}

 (5)操作方法

concat():创建当前数组的一个副本,添加参数到这个副本的末尾,并返回这个新构建的数组。(即原数组不变)

slice():接受一或两个参数,即要返回项的起始和结束位置(结束位置的项不返回)。只有一个参数时,则返回起始项到当前数组末尾的所有项。(原数组不变)

splice():主要用途是向数组的中部插入项。(返回原数组被删除的项组成的数组,或一个空数组)如3种情况:

    1.删除:2个参数,要删除的第一项的位置和要删除的项数。splice(0,2)删除数组中的前两项。

           2.插入:3个(或以上)参数,起始位置、0(要删除的项数)、要插入的任意项。splice(2,0,'insert')从前数组的位置2插入项'insert'(注意'insert'是第

                       2项而不是第3项)。

           3.替换:3个(或以上)参数,起始位置、要删除的项数、要插入的任意项。splice(2,1,'red','green')删除位置2的项,从位置2插入指定项。

(6)位置方法

indexOf():两个参数,要查找的项和(可选的)表示查找起点的位置的索引。从左向右查找。

lastIndesOf():同上,不同的是从右向左查找。

这两个方法都返回要查找的项在数组中的位置,找不到则返回-1。

var num = [1,2,3,4,5,4,3,2,1];
alert(num.indexOf(4)); //3
alert(num.lastIndexOf(4)); //5

alert(num.indexOf(4,4)); //5
alert(num.lastIndesOf(4,4)); //3

 (7)迭代方法

ES5为数组定义了5个迭代方法。每个方法都接受两个参数:要在每一项上运行的函数和(可选的)运行该函数的作用域——影响this值。

而传入这些方法中的函数接收3个参数:数组项的值、该项在数组中的下标、数组对象本身。

every():对数组中的每一项运行给定函数,如果每一项都返回true,则返回true。

some():对数组中的每一项运行给定函数,只要有任一项返回true,则返回true。

filter():对数组中的每一项运行给定函数,返回该函数会返回true的项组成的数组。

forEach():对数组中的每一项运行给定函数,没有返回值。

map():对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组。

(8)归并方法

ES5新增两个归并数组的方法:reduce()、reduceRight()。这两个方法会迭代数组的所有项,然后构建一个最终返回的值。

reduce()方法从数组的第一项开始,reduceRight()相反。

它们都接收两个参数:在每一项上调用的函数、(可选的)作为归并基础的初始值。

传入的函数接收4个参数:前一个值、当前值、项的索引、数组对象。

var num = [1,2,3,4,5];
var sum = num.reduce(function(prev,cur,index,array){
//这个函数的返回值会作为第一个参数自动传给下一项。在这里,第一次迭代:prev是1,cur是2。
//第二次迭代,prev是3(1+2的结果),cur是3.
return prev + cur;
});
alert(sum); //15

 二、字符串

(1)字符方法

charAt():接收一个表示字符位置的参数。var str = 'hello';     alert(str.charAt(1));  // 'e'

charCodeAt():参数同上。得到的不是字符而是字符编码。var str = 'hello';     alert(str.charCodeAt(1));  // '101'

也可以使用方括号加索引来访问:var str = 'hello';     alert(str[1]); //'e'

(2)字符串操作方法(以下方法不会影响原字符串)

concat():同数组的类似。实践中更多的是用+。

slice():2个参数表示子字符串的开始位置、结束位置(不包括在子字符串中)。

substring():同上。

substr():第一个参数同上,第二个参数表示返回的字符个数。

以上如果没有第2个参数,则将字符串的长度作为结束位置。

(3)字符串位置方法

indexOf():参考上面数组的。

lastIndesOf():参考上面数组的。

(4)trim()方法:创建一个字符串的副本,删除前置及后缀的所有空格,返回结果。

(5)大小写转换

toLowerCase()、toLocaleLowerCase()、toUpperCase()、toLocaleUpperCase()。

(6)模式匹配方法(待补充)

match()

search()

replace()

split()

(7)localeCompare()方法

这个方法比较两个字符串,返回以下值:

如果字符串在字母表中应该排在字符串参数之前,返回负数(-1),在其之后,则返回正数(1),相等则返回0。(不同地区,方法的行为不同。如国家不同。)

var str = 'yellow';
str.localeCompare('brick'); //1
str.localeCompare('yellow'); //0
str.localeCompare('zoo'); //-1

(8)fromCharCode()

这是String构造函数的一个静态方法。接收一或多个字符串编码,然后将它们转换成一个字符串。与charCodeAt()执行的是相反的操作。

String.fromCharCode(104); //'h'

本文链接


    
[3]javascript学习笔记[4]--函数
    来源:    发布时间: 2013-11-06

           好了,现在开始函数这一章节,这之后就开始面向对象,加油吧,多看点。

          4.1 内建的全局函数

             javascript中内建了很多预定义的函数(也叫做全局函数或者顶级函数),用于处理常见的操作。可以看作是Global类的方法,并且常量Infinity和NaN可以看作是Global类的属性,方法包括escape(), eval(), isFinite(), inNaN(),parseFloat(), parseInt(),Boolean(), Number(), String(),  unescape(), encodeURI(), decodeURI(), encodeURIComponent(), decodeURIComponent()。

           值得一提的就是eval(), encodeURIComponent(), decodeURIComponent().。

           eval():

var x3 = "good!";
var x = 3;
var y = eval("x"+x); //获取变量x3,也即 y = x3;
document.write(y); //输出good!

         encodeURIComponent():

        在网上找了一篇文章,感觉还行escape()、encodeURI()、encodeURIComponent()区别详解  里面有相关代码,也是W3school上范例,记忆中自己也写过有关URL解析的代码,结果后来找到了下面一段,感觉写的不错,用一个函数封装好了,索性也就贴出来了。

//其实是解析url传递的参数的
function analysisUrl(){
var vals =[];
var query= location.search.substring(1).split('&');
var i =0;
var index;
for(;i<query.length;i++){
index = query[i].indexOf("=");
vals[i] = query[i].substring(index+1);
}
var add = new Function("x","y","return x+y");


//等价于
function add(x,y){
return x+y;
}

 

return vals;
}
function loadData(){
var busData;
var vals = analysisUrl();
console.log(vals.length);
var customerId = vals[0]; //从这里开始,就可以换成你所需的参数的名字
var startDate = vals[1];
var lastDate = vals[2];
}

         4.2 自定义函数

              函数定义有三种方法:

                 1) 最常见的,也是推荐的--函数语句:

                             function myFunc(arg_1,arg_2){

                             //执行语句

                              }

                 2)  函数表达式定义函数(匿名函数)

                      var myfunc = function(arg_1,arg_2){

                        // 执行语句

                       }

                3) 使用function类定义函数

                     var myFunc = new Function([arg1,arg2],functionBody);

 

              前两种函数定义方法的区别:

               区别有很多呢,简单的说就是推荐使用第一种,我在一个视频教程上说第二种有严重的性能问题,不推荐。下面具体看一下吧。

               1)用函数语句定义不管在定义之前还是之后都能被脚本引用,简单地说就是看下面代码:

//函数语句,这样是可以的
myFunc();
function myFunc(){}


//函数表达式,这样是不可以的
myFunc();
var myFunc = function(){}

             2) 函数表达式作为另一些函数或方法的参数,这个不就是用匿名函数作为参数么,随便给段代码吧:

$.ajax( {
url : 'getSecondIdAction.action?t=' + new Date(),
type : 'post',
async : false,
datatype : 'json',
success : function(data) { //函数表达式
secondIdData = data;
secondIdCombox = $('#secondId').combobox( {
valueField : 'dptid',
textField : 'dptname',
data : secondIdData,
onSelect : function(record) { //函数表达式
thirdIdCombox.combobox('clear');
changeThirdIdData(record.dptid);
managerScoreQuery(record.dptid);
}
});

                 3) 如果记得在学习笔记1中的显式释放,垃圾回收机制的话,那在这边函数表达式就可以这样用。代码就不贴了。

             总结:如果没有特殊用途,就使用函数语句吧,函数表达式就是用在使用一次后便丢弃的函数,这样有利于内存管理(匿名函数不都是这样用的么)。还有就是像prototype属性附加函数以实现对象方法的定义,在面向对象编程中较多。

              4.3 匿名自执行函数

                   函数是一个封闭的作用域范围,并且可以嵌套函数,所以可以使用这种匿名自执行函数来实现封装自己的所有函数和变量,从而避免来自多个开发者的多个函数相互冲突。用到了闭包的原理,这个留待以后详细解决吧,很重要的一个概念。

(function(){
//一些执行语句
})();

//
    
最新技术文章:
▪css white-space:nowrap属性用法(可以强制文字不...
▪IE里button设置border:none属性无效解决方法
▪border:none与border:0使用区别
▪html清除浮动的6种方法示例
▪三个不常见的 HTML5 实用新特性简介
▪css代码优化的12个技巧
▪低版本IE正常运行HTML5+CSS3网站的3种解决方案
▪CSS Hack大全-教你如何区分出IE6-IE10、FireFox、Chr...
▪ie6,ie7,ie8完美支持position:fixed的终极解决方案
▪小技巧处理div内容溢出
▪html小技巧之td,div标签里内容不换行
▪纯CSS实现鼠标放上去改变文字内容
▪li中插入img图片间有空隙的解决方案
▪CSS3中Transition属性详解以及示例分享
▪父div高度不能自适应子div高度的解决方案
▪告别AJAX实现无刷新提交表单
▪从零学CSS系列之文本属性
▪HTML 标签
▪CSS3+Js实现响应式导航条
▪CSS3实例分享之多重背景的实现(Multiple background...
▪用css截取字符的几种方法详解(css排版隐藏溢...
▪页面遮罩层,并且阻止页面body滚动。bootstrap...
▪CSS可以做的几个令你叹为观止的实例分享
▪详细分析css float 属性以及position:absolute 的区...
▪IE6/IE7/IE8/IE9中tbody的innerHTML不能赋值的完美解...
▪CSS小例子(只显示下划线的文本框,像文字一...
▪可以给img元素设置背景图
▪不通过JavaScript实现的自动滚动视差效果
▪div+CSS 兼容小摘
▪CSS的inherit与auto使用分析
 


站内导航:


特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

©2012-2021,,E-mail:www_#163.com(请将#改为@)

浙ICP备11055608号-3