俺这些天在琢磨这个。
用javaScript点击id、点击className、点击tagName
不管是什么，不管有没有效果，只要有id就能点。
点击id:
function clickId(id){
if(document.all) {
document.getElementById(id).click();
}
else {
var evt = document.createEvent("MouseEvents");
evt.initEvent("click", true, true);
document.getElementById(id).dispatchEvent(evt);
}
}
没有id?，那有className吧，还是能点。
点击className:
function clickClassName(className, num){
var retnode = [];
var myclass = new RegExp('\\b'+className+'\\b');
var elem = document.getElementsByTagName('*');
for (var i = 0; i < elem.length; i++) {
var classes = elem[i].className;
if (myclass.test(classes)) retnode.push(elem[i]);
}
var el = retnode[num];
if(el.click) {
el.click();
}else{
try{
var evt = document.createEvent('Event');
evt.initEvent('click',true,true);
el.dispatchEvent(evt);
}catch(e){alert(e)};
}
}
连className也没有？那总有tagName吧，还是能点。
点击tagName:
function clickTagName(tagName, num){
var retnode = [];
var elem = document.getElementsByTagName(tagName);
for (var i = 0; i < elem.length; i++) {
var tagNames = elem[i].tagName;
if (tagName = tagNames) retnode.push(elem[i]);
}
var el = retnode[num];
if(el.click) {
el.click();
}else{
try{
var evt = document.createEvent('Event');
evt.initEvent('click',true,true);
el.dispatchEvent(evt);
}catch(e){alert(e)};
}
}
tagName也没有？那我就没辙了。
你搞成plainText，我还有什么办法？
你还不够狠，最狠是你写在纸上。我更没办法了。
1．JavaScript代码风格
http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml
2．Closure Compiler(封闭编辑器)
https://developers.google.com/closure
Google此前曾开源了不少JavaScript工具，如Closure Compiler（用于生成紧凑且高性能代码的工具）、Closure Templates（用于动态生成HTML）、Closure Linter（JavaScript风格检查器）及Closure Stylesheets（对CSS的一套扩展）。早在去年6月，Google曾发布了GWT（另一个用于构建JavaScript应用的工具集）的一个发布候选版，但其未来还是有些不太明朗，因为Google将很多GWT开发者都转到了Dart上，后者被看作是“对GWT的一次巨大变革，可以为最终用户创建出更棒的Web应用，我们对其潜力持乐观态度”。
Closure 编译器是一个JavaScript优化器，为Web应用程序生成紧凑，高性能的JavaScript代码，它移除了不必要的代码，并经过重写和优化，保持娇小的身材，以便在浏览器的JavaScript引擎上运行得更快，这个编译器也会检查语法，变量引用和类型，并对常见的JavaScript陷阱发出警告，这些功能有助于你写出bug更少，更易于维护的程序。
你也可以使用Closure检查器，它是一个Firebug扩展，主要用于调试那些难以阅读的代码。
3．Closure Templates(封闭模版)
https://developers.google.com/closure
Closure模板的前身是Web模板，通过预编译以提高JavaScript效率，Closure模板有一套简单的语法，程序员很快就可以掌握，和传统的模板系统不一样，你可以将Closure模板视为很小的组件，然后通过组装形成一个正式的Web页面，从此不再需要为每个页面设计一个大大的模板了
4．Closure Linter（JavaScript风格检查器）
https://developers.google.com/closure
5．Closure Library
https://developers.google.com/closure
https://code.google.com/p/closure-library/wiki/GettingStartedWithClosureLibrary
Closure库是一个广泛的，经过严格测试的，模块化的，跨浏览器的JavaScript库，Web开发人员可以在他们的用户界面中直接通过拖拉进行复用。
6．Closure Stylesheets（对CSS的一套扩展）
https://code.google.com/p/closure-stylesheets/
Closure Stylesheets is an extension to CSS that adds variables, functions, conditionals, and mixins to standard CSS. The tool also supportsminification, linting, RTL flipping, and CSS class renaming.
7．JavaScript代码覆盖率工具
ScriptCover 是 Google 推出的一款 JavaScript 代码覆盖率分析工具，为 Web 页面提供实时、逐行的代码覆盖分析。Google 表示，ScriptCover 最终将应用在 Chrome 浏览器上成为它的一个扩展。
ScriptCover 的更多详细信息可以查看 Google Open Source 博客的这篇文章，以及 Google Code 上的相关文档。ScriptCover 的代码将托管于 Google Code 上，基于 Apache Lience v2。
8．检测内存泄漏的JavaScript工具
近日，Google开源了Leak Finder，这款工具可以查看JavaScript应用的堆，进而发现内存泄漏
9．基于Node.js的JavaScript测试执行器
Testacular的灵感来源于JS Test Driver，而编写另外一个测试运行器是因为“他们在使用JSTD中遇到的诸多问题”，他们希望有“一个能够稳定快速执行JavaScript测试的简单工具。这是我们使用强大的Socket.io库和Node.js的原因。”
10．Testacular JavaScript 基准测试套件 Octane
谷歌发布了新的开源 JavaScript 基准测试套件 Octane，它包含了 13 个测试，用于测量浏览器加载与执行复杂的大型 JavaScript 应用的性能，如游戏、交互、富 Web 页面和在线工具等。Octane 包含了最初的 V8基准套件提供的 8 个测试，以及新增加的 5 个测试——pdf.js，Mandreel，GB Emulator（GB 模拟器），Code Loading（代码加载），Box2DWeb——可以测量其余测试力有未逮的性能领域。
11．Google开源网页加速工具Page Speed
http://code.google.com/speed/page-speed
age Speed是运行在Firebug里的Firefox插件。该工具可以运行在Linux、Mac和Windows XP/Vista之上。Page Speed在运行时会分析一些Web服务器配置和服务器上下载下来的代码，还会创建一个结果列表，其中包括如何改进网页的建议。分析基于一个分为五类的最佳实践列表：
· 优化缓存——让你应用的数据和逻辑完全避免使用网络
· 减少回应时间——减少一连串请求-响应周期的数量
· 减小请求大小——减少上传大小
· 减小有效负荷大小——减小响应、下载和缓存页面的大小
· 优化浏览器渲染——改善浏览器的页面布局
12．在线语法高亮工具
https://code.google.com/p/google-code-prettify/
本文链接
Javascript设计模式读书笔记一
1、Javascript 类的使用。在使用几年的Javascript中,感觉还不是很深入,只是用得比较肤浅。基本上写的都是一些小函数，没怎么用过类。
比如说：
function startAnimation(){
…
}
function staopAnimation(){
…
}
上面的做法很简单就是一个开始和结束动画的函数，但是无法创建可以保存状态并且可以对内部状态进行操作的动画对象。下面是定义的类的实现：
var Anim=function(){
…
};
Anim.prototype.start=function(){
…
}
Anim.prototype.stop=function(){
…
}
类的使用：
var myAnim=new Anim();
myAnim.start();
…
myAnim.stop();
上面定义一个类Anim并且把两个方法赋给类的prototype属性。
如果更喜欢把类的定义封装在一条声明中，可以使用下面的代码：
var Anim=function(){
…
};
Anim.prototype={
Start:function(){
…
}.
Stop:function(){
…
}
};
以上代码还可以以另外一种风格代码如下：
Function.prototype.method=function(name,fn){
this.prototype[name]=fn;
};
var Anim=function(){
…
};
Anim.method(‘start’,function(){
…
});
Anim.method(‘stop’,function(){
…
});
Function.prototype.method用于为类添加新方法。第一个表示方法名称，第二个表示用作新方法的函数。
可以进一步修改Function.prototype.method,使其可以链式调用。这只需要让他返回this值即可。代码如下：
Function.prototype.method=function(name,fn){
this.prototype[name]=fn;
return this;
};
var Anim=function(){
…
};
Anim.method(‘start’,function(){
…
}).method(‘stop’,function(){
…
});
以上就采用五种方式完成同一项工作。
2、匿名函数
(function(){
…
})()
Eg:
(function(foo,bar){
alert(foo*bar);
})(10,2)
匿名函数最有趣的用途是用来创建闭包。闭包是一个受到保护的变量空间。另外javascript具有函数级的作用域。这意味着定义在函数内部的变量在函数外部不能访问。这就意味着函数运行在它定义的的作用域中，而不是调用在它的作用域中。通过这两个因素就可以把变量包裹在匿名函数中而对其加以保护。你可以如下创建类的私有变量：
var baz;
(function(){
var foo=10;
var bar=2;
baz =function(){
return foo*bar;
};
})();
baz(); //baz可以访问foo,bar，尽管这个方法在匿名函数的外部执行。
baz定义在闭包中，所以它能访问foo,bar 这两个匿名函数中的变量。
运行结果：运弹出网页消息20;
3、对象的易变性
在js中，一切对象都是都是易变的。这意味着你能使用在大多数的语言中不允许的技术，例如为函数添加属性。
function displayError(message)
{
displayError.numTimesExecuted++;
alert(message);
alert(displayError.numTimesExecuted);
};
displayError.numTimesExecuted=0;
这也意味着你可以对先前定义的类和实例化的对象进行修改。
如下所示演示修改类以及实例化后修改对象：
function Person(name,age){
this.name=name;
this.age=age;
};
Person.prototype={
getName:function(){
return this.name;
},
getAge:function(){
return this.age;
}
}
//实例化对象
var alice=new Person(‘Alice’,20);
var bill=new Person(‘Bill’,30);
//修改类
Person.prototype.getGreeting=function(){
return ‘Hi’+this.getName()+’!’;
};
//修改一个特定的实例
alice.displayGreeting=function(){
alert(this.getGreeting());
}
getGreeting在实例化对象创建后创建的，但他们两个实例仍可获得这个方法。另外displayGreeting只有alice实例得到这个方法，其它实例就没有。
4、继承。继承在js中不像另的面向对象语言中那样简单。JS使用的是基于对象的(原形式(prototypal))继承，它可以用来模仿基于类的(类式(classical))继承。这两种方式以后会讲。
本文链接