碧水轩

对于在JavaScript中!document.getElementById、!document.createTextNode等这样的形式该如何理解，我想很多人并不是非常的清楚，但是看了以下的代码我想我们就会有一个非常深刻的理解。

在使用JavaScript中，我们常常知道比较两个英文字符串是根据字符本身的ASCII码的大小，从左往右进行比较（很多教程上都这么说）。但是对于这样一种说法我认为不合适，毕竟字符串中不仅有英文，而且有中文，对于中文的比较也可以的，但是ASCII码却不能表示中文。

ASCII字符编码是一种7位编码，范围从0×00-0×7F，包括了英文字母，阿拉伯数字，标点符号，控制字符等，其中0×00-0×20和0×7F表示控制字符。

  在今天我在查找如果提高自己网站的Alexa排名的时候，其中的一个方法就是把自己的网站的链接变成Alexa的重定向链接，如下面的链接所示：
  http://redirect.alexa.com/redirect?www.ecoviews.cn
任何人只有点击了这个链接，那么都可以给我的Alexa排名做贡献，有趣的是我们打开的网页却仍然是我们自己网站的网页，不信的话你可以点击此处查看，打开的就是我网站的主页，却不是Alexa的网站。
但是我们在来看看下面的这种情况：
代码如下：
点击进入<a href=”http://www.baidu.com?www.google.cn“>百度网站</a>
效果为：点击进入百度网站，你会发现打开的网站却是百度的，而不是谷歌的网站，那么你就会想，Alexa的这种重定向是如何实现的的？
   这个功能完全可以使用JavaScript来实现，如你要打开的地址为：http://127.0.0.1/phpstudy/test.html?www.ecoviews.cn
你只需在你的test.html文件中写入以下的代码就可以。
<script type=”text/javascript”>
var localurl =window.location.href;
var url=localurl.split(“?”);
window.location.href=”http://”+url[1];
</script>
  实现的原理就是：获得？后面的url，然后在跳转到该地址就行了，因此能够实现这样功能的方法还有很多，上面的仅仅是一种而已。

这几天自己在做一个网站，在实现新闻列表选择的时候自己想实现下面这样的功能：
1.如果用户的鼠标不在某条新闻上时，新闻背景显示为背景色。
2.如果用户的鼠标在某条新闻上时，新闻背景显示为白色。
一个图例如下所示：

但是可惜的是我写了JavaScript代码，但是不知道为什么总是不起作用，我的JavaScript代码如下所示：
  
后来自己找到了原因所在：原因是自己的网页编码为utf-8的格式，而JavaScript代码为gb2312的格式，结果造成了JavaScript代码不起作用。
后台把JavaScript代码改为utf-8的格式后，成功了。
做法就是：用记事本打开js文件，然后另存为，在另存为选择编码为utf-8。
如下图所示：

  对于任何一个想在网络中找到自己想要的资料的人来说，找到自己想要的资料的时候是非常开心的事情的，毕竟这就意味着自己的问题得到了解决，自己不用再为了这个疑难而劳神伤心！
  不过我们常常在找到资料的时候感到不愉快，因为现在的网页制作不知道是怎么了，也许是网站主为了故意想让我们这些浏览者点击广告吧，他们常常把一些广告放在了网页的文章之中，当然这并不可厚非，毕竟网站主最主要或者说唯一的收入来源就是网站的广告。但是如果网站主仅仅是为了想增加自己的收入而不顾我们浏览者的感受的话，我想这样的网站主不是一个合格的。
  举一个简单的例子来说，当我们查找到我们需要的资料的时候，我们往往希望把这些资料给保存下来，一方面是怕自己以后再遇到相似问题时自己忘记了，二是避免自己以后忘记时再宠信花时间去查找这些资料，但是如果网站的站主禁止了页面的复制功能，或者是网站的站主在页面中嵌入了广告的话，那么着对于我们浏览者来说是不好的，一是不能保存我们需要的资料，二是我们在复制资料时十分的麻烦。当然我们浏览者也要加强自己的版权意识，毕竟很多网站禁止复制的原因就是为了保护自己的版权，而这正是我们网站浏览者所忽视的。
  不过在我看来，一个博客应该是以浏览者为主的，能为浏览者考虑的网站是才算得上是一个优秀的网站，因此如果一个网站能够提供一个复制网站文章内容的功能的话，我想就可以减轻我们浏览者很多的麻烦，毕竟每次选中我们要复制的文字本身是一件麻烦的事情，而实现这样的功能本身也非常的简单。
  下面我们用JavaScript来实现！具体的代码如下：
<script type=”text/javascript”>
// <![CDATA[
function copy_clip(copy)
{
copy="碧水轩|http://www.ecoviews.cn \r\n"+copy;
if (window.clipboardData)
{
window.clipboardData.setData("Text", copy);
}
else
if (window.netscape)
{
netscape.security.PrivilegeManager.enablePrivilege('UniversalXPConnect');
var clip = Components.classes['@mozilla.org/widget/clipboard;1'].createInstance(Components.interfaces.nsIClipboard);
if (!clip) return;
var trans = Components.classes['@mozilla.org/widget/transferable;1'].createInstance(Components.interfaces.nsITransferable);
if (!trans) return;
trans.addDataFlavor(‘text/unicode’);
var str = new Object();
var len = new Object();
var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);
var copytext=copy;
str.data=copytext;
trans.setTransferData(“text/unicode”,str,copytext.length*2);
var clipid=Components.interfaces.nsIClipboard;
if (!clip) return false;
clip.setData(trans,null,clipid.kGlobalClipboard);
}
alert(“内容已经复制到剪切板！”)
}
// ]]>
</script>
<!–以上为主要代码–>
<input type=”text” id=”ff” value=”www.baidu.com” /><button onclick=”copy_clip(document.getElementById(‘ff’).value)”>复制
</button>

  在通常情况下，我们使用window.location=URL与window.location.href=URL来进行页面的跳转时没有什么不同，在IE与Firefox下我自己测试过，无论是URL是绝对路径还是相对路径，两者都可以起作用。
  但是仔细再Google上查找了相似的问题，却发现原来另有情况，那就是：
（源地址：http://www.cnpublic.com/2009/06/windowlocationhref-invalid/）
  浏览器区别:IE或者Firefox2.0.x下,可以使用window.location或window.location.href;
Firefox1.5.x下,只能使用window.location.

 在进行web开发的过程中，后台管理是一个非常重要的部分，而后台管理又常常因为数据的条目和类别太多使我们的网页设计人员常常感到头痛，毕竟有时常常得考虑在一个页面中显示很多的条目与内容，但是却又要保持页面的视觉效果，而这两者之间又常常是想冲突的。因此在我们进行后台设计时，引入一种竖向或者横向的伸缩列表，达到显示内容与视觉效果相和谐的目的。
  伸缩列表有两种，一种是竖向的，这种常常在后台中使用，模拟的是电脑中文件夹的操作，而横向的更多的是用于网站的前台导航。因此，在这我们先介绍竖向伸缩列表的做法。
  效果图如下所示：
 
 该图是页面开始运行是的效果图，在每一个类别下面有若干小类，我们只要点击相应的类别就可以把相关类别展开，效果图如下所示，在点击一次，相关类别收缩。
 
其功能的实现方式是通过JavaScript来控制相应元素的显示与隐藏，关键的JavaScript代码如下：
 function go(index)
{
var images=document.images;
if(images[index].src.indexOf(“add”)!=-1)
images[index].src=”images/dec.jpg”;
else
images[index].src=”images/add.png”;
 var tables=document.getElementsByTagName(“table”);//.length;index=2*index+1;
 if(tables[index].style.display==”none”)
 tables[index].style.display=”block”;
 else
 tables[index].style.display=”none”;
}
</script>
  你也可以通过点击这里获取该文件的原代码。

  在我们浏览网站的时候，我们可能遇到这样的一种情况，那就是网站提供给我们一个下拉列表，然后我们选择之后，网站自动地跳转到我们选择的页面。自己一个真实的体会就是在一次国外网站注册的过程中，自己通过下拉列表选择自己的国籍后，网站自动定位到了一个中文页面进行注册。
  此时我们不禁会想，这样的功能我们应该怎么实现呢？实现有两种方法，一种是客服端进行实现—–使用JavaScript，另一种使用服务器端进行实现—利用PHP或JSP等动态语言实现，显而易见使用客服端要好，毕竟这样可以减少服务器的压力。
  我通过一个实例来说说明，读者可以通过该实例来进行体会。
<html>
<head><title>下拉列表实现跳转</title></head>
<body>
<select onchange=”eval(‘window.location=this.options[this.selectedIndex].value’)”>
<option value=”1.html”>1.html</option>
<option value=”2.html”>2.html</option>
<option value=”3.html”>3.html</option>
</body>
<html>
  通过测试，可以实现我上面所说的内容，你可以通过这里来获取该源文件。