1．
传递参数为自身的时候，因该传递this.id然后在javascript中重新使用document.getElementById(it)获取。或者 我们使用事件源对象event.srcElement。.用this时候把人搞迷糊，很多情况下都能使用this，但是得到的对象不同，所以在javascript中指代有些不明确。
2.
在javascript中 使用var io=getElementsByName(“rt”) 获得的是一个数组，而不管id为rt的标签是一个还是更多，因此使用中必须用io[0]调用。同理getElementsByTagName
同理getElementById（ui） 不管数量多少只能获得第一个命名为ui 的标签。浏览器不对你使用多个标签同一id报错
3.
给对象绑定方法
<div id="elmtDiv">division element</div>
<script language="javascript">var div = document.getElementById('elmtDiv');
div.attachEvent('onclick', EventHandler);
function EventHandler() { // 在此使用this } </script>
<div id="elmtDiv">division element</div>
<script language="javascript">
var div = document.getElementById('elmtDiv');
div.onclick = function()
{ // 在此使用this
};
</script>
4. 修改事件函数
<input type="button" id="button1" value="button1">
JS: 0
document.getElementById("button1").onclick = function()
{
this.style.backgroundColor = "red";
}
5.调试方法，如果对这个标签用的不熟，我一般.type,.value或者.tagName查看自己获得的是什么东西。
也可以使用try...catch来进行异常处理。例如：
try {
foo.bar();
} catch (e) {
alert(e.name + ": " + e.message);
}
- EvalError: raised when an error occurs executing code in eval()
- RangeError: raised when a numeric variable or parameter is outside of its valid range
- ReferenceError: raised when de-referencing an invalid reference
- SyntaxError: raised when a syntax error occurs while parsing code in eval()
- TypeError: raised when a variable or parameter is not a valid type
- URIError: raised when encodeURI() or decodeURI() are passed invalid parameters
上面的六种异常对象都继承自Error对象。他们都支持以下两种构造方法:
new Error();
new Error("异常信息");
手工抛出异常的方法如下：
try {
throw new Error("Whoops!");
} catch (e) {
alert(e.name + ": " + e.message);
}
如要判断异常信息的类型，可在catch中进行判断：
try {
foo.bar();
} catch (e) {
if (e instanceof EvalError) {
alert(e.name + ":" + e.message);
}
else if (e instanceof RangeError) {
alert(e.name + ": " + e.message);
}
// etc
}
Error具有下面一些主要属性：
- description: 错误描述 (仅IE可用).
- fileName: 出错的文件名 (仅Mozilla可用).
- lineNumber: 出错的行数 (仅Mozilla可用).
- message: 错误信息 (在IE下同description)
- name: 错误类型.
- number: 错误代码 (仅IE可用).
- stack: 像Java中的Stack Trace一样的错误堆栈信息 (仅Mozilla可用).
因此为了更好的了解错误信息我们可以将catch部分改为如下形式：
try {
foo.bar();
} catch (e) {
if (browserType != BROWSER_IE) {
alert("name: " + e.name +
"message: " + e.message +
"lineNumber: " + e.lineNumber +
"fileName: " + e.fileName +
"stack: " + e.stack);
}
else {
alert("name: " + e.name +
"errorNumber: " + (e.number & 0xFFFF ) +
"message: " + e.message");
}
}
Javascript中的throw命令事实上可以抛出任何对象，并且我们可以在catch接受到此对象。例如：
try {
throw new Date(); // 抛出当前时间对象
} catch (e) {
alert(e.toLocaleString()); // 使用本地格式显示当前时间
}
6.节点的属性:获得你想要处理的东西就成功一半了。
使用 DOM 节点时需要一些属性和方法，因此我们首先来讨论节点的属性和方法。DOM 节点的属性主要有:
·
nodeName 报告节点的名称(详见下述)。
·
nodeValue 提供节点的 “值”(详见后述)。
·
parentNode 返回节点的父节点。记住，每个元素、属性和文本都有一个父节点。
·
childNodes 是节点的孩子节点列表。对于 HTML，该列表仅对元素有意义，文本节点和属性节点都没有孩子。
·
firstChild 仅仅是 childNodes 列表中第一个节点的快捷方式。
·
lastChild 是另一种快捷方式，表示 childNodes 列表中的最后一个节点。
·
previousSibling 返回当前节点之前
的节点。换句话说，它返回当前节点的父节点的 childNodes 列表中位于该节点前面的那个节点(如果感到迷惑，重新读前面一句)。
·
nextSibling 类似于 previousSibling 属性，返回父节点的 childNodes 列表中的下一个节点。
·
attributes 仅用于元素节点，返回元素的属性列表。
其他少数几种属性实际上仅用于更一般的 XML 文档，在处理基于 HTML 的网页时没有多少用处。
取得父节点
function setParentCheck(node)
{
var tempNode;
//得到父节点
tempNode=node.getParent();
if(tempNode!=null)
{
//选中
tempNode.setAttribute("Checked","true");
//递归
setParentCheck(tempNode);
}
}
7.只可读文本框：disabled的作用使它不可用，并且它不会被提交给服务器，所以一般用属性readonly=”readonly”.使经常有些数据要从数据库中读出显示但是不能修改，并且在下一次请求提交时被继续提交，struts中直接使用文本标签就行！
8. javascript中获取的标签的值都为字符串（在jsp中一样，反正为了保险，从页面提交的数据你都要把它看成字符格式），所以要如果要进行计算必需先进行转换。parseInt(thisObject.style.height)；thisObject.style.height为字符串
9.
Js调试不是一般的麻烦。在出现一个方法调用一个方法，这个方法调用另一个方法，如果最低层的方法出现错误，那么浏览器报错指报第一个开始调用位置的错误。现在唯一节省时间的调试方法就是小心再小心。另外如果不是程序员可以使用一些开源框架，如jquery。很多浏览器兼容问题，语法上迷惑，都已经被新的语法结构替代。这些框架就是在javascrip原有基础上添加一些东西，告诉你一些东西别用，制造一些规则，使开发起来更容易，代码读起来更容易理解
10.javascript程序不执行，浏览器也没报错，可能是复制时有不同字符集的编码字符给粘贴过来了。
计算问题javascrip中要使input的值相加，标签必须要有value值下面也是错误的，没有value属性，和value=””都将导致相加结果为NAN<input type="text" name="r" value="" />
</body>
<script type="text/javascript">
function total() {
var arr = document.getElementsByName('r');
alert(arr.length);
var total=0;
for(var i=0; i <arr.length; i++ ){
total=total+parseFloat(arr.value);
//修改在前面添加一句arr.value=(arr.value==""?0:arr.value);
alert(total);
}
return total;
}
Total();
</script>
在javascrip中处理从数据库中读出的数据，然后回写，涉及到数据的初始值是不是满足业务需要，所以简单问题复杂化了，如果不需动态回写数据最好在服务器端做。
11.
Javascript的解释方式是从上到下的逐行解释，和html混杂在一起编译（翻译），这个初学者经常不注意，导致得不到自己所需要处理的标签。onload()是在在整个html文档加载完后执行的，所以一个简单方案就是把拟的所有初始化数据丢这个里面，等前面的东西都被浏览器构建出来了再执行。我的struts,idea,下使用它会失效，不知道为什么，很郁闷，只好把代码直接丢到最后
12.javascript escape函数 对应有个unescape,这个函数的作用是把字符编码。碰到一个从数据库读出的数组循环显示后，然后又要连成一个字符串写回数据库的需求，得到数据处理后记得要escape一下！主要是为了安全转换掉符号，最好是在服务器端做这种事情。
| escape方法对 String 对象编码以便它们能在所有计算机上可读， escape(charString) 必选项 charstring参数是要编码的任意 String 对象或文字。 说明 escape 方法返回一个包含了 charstring 内容的字符串值（ Unicode 格式）。所有空格、标点、重音符号以及其他非 ASCII 字符都用 %xx 编码代替，其中 xx等于表示该字符的十六进制数。例如，空格返回的是 "%20" 。 字符值大于 255 的以 %uxxxx 格式存储。 注意 escape方法不能够用来对统一资源标示码 (URI) 进行编码。对其编码应使用 encodeURI 和encodeURIComponent 方法。 |
13.数据计算：从数据库中读出一大笔数据，不知道列的数量和行的数量，还要分组显示，在用户单击后要在页面进行计算，然后写回数据库，因为html，javascrip中队列的操作很少,如果在一列要获取另一不同列，不同行的数据非常难。我解决办法是用如果要数量的数据是一一对应的，那就把一个标签的属性值直接用另一个数据的值表示，如要计算值a+值b：<input type="text" class="值a" value="值b"/>这样我们就能简单的获取这两个值，另外还可以使用隐藏变量；如果在不同行不同列要获取就很复了，但是只要数据存在关联关系，我们可以建立有规律唯一id,来取值，这个说起来麻烦，也说不清楚。
反正一个要点：用一切办法把要处理的相关数据相关联，让他们相互之间容易使用javascrip获取。
14.学习js基础走向ajax的关键：
1）基本程序语法：for,if ...else...,var,数组
2）获取需要处理标签的是成功的一半
3）创建，删除，隐藏显示标签的方法。
4)一个有代码提示的javascrip编辑器。
5)百度！
10.document.getElementByElement("yu");
取属性有id="yu"，如果没有就取name="yu"的第一个！
为什么微软要这么做？不知道！
复杂表格操作示例下载：今天修改公司以前别人的代码，涉及到数据库中读出的大量数据操作，真的是头痛啊！把他的代码贴给大家学习下，代码质量不是很好，但是还是值得学习！主要是addShipmentID（）这个js函数弄懂。
见附件
outerHTML、innerHTML以及innerTEXT三者的区别可以通过下图展示出来
17、eval（参数） 函数
这是个好东西，可以让你更自由的使用javascript，听说有个面向对象框架也是基于它的。原因：动态执行，它动态执行的含义是，你可以传递一个字符串给他，如果字符串是正确的javascript语句，则会执行，否则浏览器会报未定义错误。
有个注意的地方是：IE中它有作用范围（作用域），即你在一个函数里使用eval()执行一条语句定义一个变量，那么这个变量的作用范围是这个函数里面。而其他浏览器没有，下面我会给出一个解决方案：
自己面向对象尝试的例子，主要体现了继承，静态变量的概念，IE7.0下测试通过：
代码:
<script type="text/javascript">
/*定义自己的名称空间：方便引用以后自己的写的会经常使用的代码就丢这里*/
var X2={}
X2.Eval=function(code){
if(!!(window.attachEvent && !window.opera)){
//IE浏览器下execscript（）函数使执行语句具有全局性，也就是说eval是有作用范围的
execscript(code);
}else{
//不是IE浏览器
window.eval(code);//其他浏览器里eval()总是在全局范围执行
}
}
var s='global';
function demo3(){
X2.Eval('var s="local"');
}
demo3();
alert(s); //测试一下X2.Eval
/*被生产对象*/function test(){
test.staticProp++;
test.prototype.staticProp=test.staticProp;//staticProp静态变量，js中全局变量是仅能用类名访问的，这里保证所有对象能访问
}
test.staticProp=0;
/*工厂*/function testFactory(name,oo){
var str="var " + name +" =new "+ oo+"()";//此语句执行产生的对象
testFactory.count++;//记录生产了几个对象
X2.Eval(str);
return eval(name); //返回对象name的引用，去掉eval的话，返回的就是未定义
}
testFactory.count=0;
/*测试执行*/
var ui = new test();
var ui2=testFactory("ui2","test");//用工厂去生产对象
alert("类的对象中察看全局变量的值"+ui.staticProp)
alert("类中全局变量staticProp的值："+test.staticProp);
alert("工厂生产出来的对象中查看staticProp的值"+ui2.staticProp);
alert("从工厂中生产出来的有"+ testFactory.count + "个");
</script>typeof(undefined) == 'undefined'
typeof(null) == 'object' typeof("") == 'string' typeof(0) == 'number' typeof(false) == 'boolean'这五个值的共同点是，在if语句中做判断，都会执行false分支。当然从广义上来看，是说明这些数值都是其对应数据类型上的无效值或空值。还有这五个值作!运算，结果全为：true。
这几个值中也有不同，其中undefined和null比较特殊，虽然null的类型是object，但是null不具有任何对象的特性，就是说我们并不能执行null.toString()、null.constructor等对象实例的默认调用。所以从这个意义上来说，null和undefined有最大的相似性。看看null == undefined的结果(true)也就更加能说明这点。不过相似归相似，还是有区别的，就是和数字运算时，10+ null结果为：10；10 + undefined结果为：NaN。
另外""、0和false虽然在if语句表现为"假值"，可它们都是有意义数据，只是被作为了"空值"或"假值"，因为："".toString()，(0).toString()和false.toString()都是合法的可执行表达式。
其实这5个值在上面所说的这些差异里，并不太会给程流程控制带来太大的问题，那么要区分它们什么呢？需要注意区分的是这些值在转换为String时的差异是比较大的，它们到String的转换关系是：
String(undefined) ->"undefined"
String(null) ->"null"
String("") ->""
String(0) ->"0"
String(false) ->"false"
这个转换关系在做字符串累加时需要特别的注意
19、提醒大家注意上面18所提的数据类型转化，另外注意一下Boolean对象和把条件语句赋值给变量。
var oFalseObject = new Boolean(false);
var bResult = oFalseObject && true; //outputs true
书中的说法是在条件表达式中所有对象被转化为true .但是你运行下面语句，发现if(bResult)始终未假，
代码:
<script type="text/javascript">
var oFalseObject = new Boolean(false);
var bResult = oFalseObject &&true; //outputs true
alert(bResult);
if(bResult){//始终为flase,所以括号中语句始终不执行
alert(hello);
}
</script>而
var bResult = oFalseObject &&true;alert(bResult);//返回的是真
var bResult = true&& oFalseObject;alert(bResult);//返回为假
最后结论是：如果条件表达式被赋值给一个变量:&&会把表达式中最后一个变量计算后的值返回给变量，而||会把第一个变量计算后的值返回给变量
但是如果你再把变量放在if或for语句中做判断条件，则是条件语句中每个变量先计算，然后进行逻辑表达式运行后的结果！
似乎有点难以明白，好的办法就是不要 使用Boolean对象，使用基本的flase和true,另外这个问题除了在我们调试的时候看到的alert结果让我们迷惑外，对程序的执行似乎也没什么影响。
20、动态改变颜色，
-----------引用：豆猫[闭关中](1096777) 10:57:12
有些时候，样式表作者可能想在可视对象（如按钮，活动窗体域，图形地图等）周围创建外廓使它们突出显示。
我用了几次是强调显示那些已经被填写过，那些还没填写，方法：
1）ie7.0,ie6.0,firfox中效果只能在type="text"看到：id或class+标签：
.chkinput {
background-color: #ff3;
outline:solid #66CC00 3px;
}
<input type="" name="er" class="chkinput" />
2）ie7.0：input[type="checkbox"] {
color: #00ffee;
background-color: #00ffee;
}
3）firefox中有一个属性可以定义outline:solid #66CC00 3px; 定义type="checkbox"或“radio”类型就用它了！
#c1 {
outline:solid #66CC00 3px;
}
<input type="checkbox" name="1" id="c1" />
如果要动态改变，那就要用到js用绑定事件函数.firefox和ie在不一样。
！谢谢豆猫在群里的指点！
21、setTimeout和setInterval的使用
，setInterval在执行完一次代码之后，经过了那个固定的时间间隔，它还会自动重复执行代码，而setTimeout只执行一次那段代码。
虽然表面上看来setTimeout只能应用在on-off方式的动作上，不过可以通过创建一个函数循环重复调用setTimeout，以实现重复的操作。
如果对计时函数不加以处理，那么setInterval将会持续执行相同的代码，一直到浏览器窗口关闭，或者用户转到了另外一个页面为止。不过还是有办法可以终止setTimeout和setInterval函数的执行。
当setInterval调用执行完毕时，它将返回一个timer ID，将来便可以利用该值对计时器进行访问，如果将该ID传递给clearInterval，便可以终止那段被调用的过程代码的执行了，具体实现如下：
var intervalProcess = setInterval("alert('GOAL!')", 3000);
var stopGoalLink = document.getElementById("stopGoalLink");
attachEventListener(stopGoalLink, "click", stopGoal, false);
function stopGoal()
{
clearInterval(intervalProcess);
}
只要点击了stopGoalLink，不管是什么时候点击，intervalProcess都会被取消掉，以后都不会再继续反复执行intervalProcess。如果在超时时间段内就取消setTimeout，那么这种终止效果也可以在setTimeout身上实现，具体实现如下：
var timeoutProcess = setTimeout("alert('GOAL!')", 3000);
var stopGoalLink = document.getElementById("stopGoalLink");
attachEventListener(stopGoalLink, "click", stopGoal, false);
function stopGoal()
{
clearTimeout(timeoutProcess);
<asp:TextBox
浙公网安备 33010602011771号