学习交流,欢迎转载。转载请注明文章来源:http://www.cnblogs.com/lgjspace/archive/2011/10/13/2218277.html
细节:
body.appendChild(document.createElement("<p>------------------------</p>"));//注意!!<p></p> 中间的内容不会加到 html 中,只能加上标签本身(这里指的不仅仅是 p 标签,所有标签都一样效果),即相当于只能创建标签,标签的 innerText 内容不会被创建。
技巧:
若想要在超链接上出现类似于 tooltip 的黄色背景提示文本,可以在 a 标签里加上 title 属性,如"title = '百度'",这样的话,在页面运行的时候,把光标放到超链接上时就会出现提示信息“百度”,但这要求光标要在超链接上停留一会时间。
细节:
与 *.appendChild(abc) 相应的 *.removeChild(abc) 的作用顾名思义,即在相应的 * 标签元素里删除掉子标签 abc。
细节:
1 <a href = "http://www.baidu.com.cn" onclick = "alert(123);">百度</a>
这行代码的运行效果是:当点击该超链接时,先弹出显示 123 的对话框,当用户点击确认后才会链接到百度的地址。即先 alert,再 href。
细节:
1 <script type = "text/javascript" >
2 function CloseDiv(){
3 alert("触发CloseDiv函数");
4 }
5 </script>
6 <td>
7 <a href = "javascript:CloseDiv()">取消</a>
8 </td>
以这种方式调用 javascript 的函数时,函数名后必须加括号,即调用函数,运行函数,否则不加括号的话不会调用函数(测试时的运行效果是直接在页面上显示“alert("触发CloseDiv函数");”)。
教训:
若需要在 js 中设置样式的 float 属性的话,必须写成 style.styleFloat,否则没有效果!!!!!!!!
提示:
层(div)与层之间的距离用 style 下的 margin 属性可以设置。
易混点,切记:
在点击 submit 按钮触发 form 表单提交的情况,该 form 标签中的 onsubmit 事件会被触发(如果有 onsubmit 事件的话);而在“不是直接点击 submit 按钮,而是通过其他事件调用 form 标签的 submit 方法”的情况下,该 form 标签中的 onsubmit 不会被触发。例如:
1 <form id = "formSubmit" action = "/Default.aspx" onsubmit = "alert('提交已被取消!');return false;"><!--在 form 标签的 onsubmit 事件中返回 false 即可取消表单的提交动作(以点击系统 submit 按钮的方式提交的情况才有效)-->
2 <input type = "text" />
3 <br />
4 <input type = "submit" value = "系统自带的 submit 按钮" />
5 <br />
6 <label>在点击 submit 按钮触发 form 表单提交时,由于该被提交的 form 标签中的 onsubmit 事件会被触发,而 onsubmit 事件中执行了取消提交行为的操作,所以点击此按钮以后没有提交效果。</label>
7 <br /><br />
8 <input type = "button" value = "普通的 button 按钮" onclick = "document.getElementById('formSubmit').submit();" />
9 <br />
10 <label>由于这是个普通的 button,点击此按钮时由于是通过此按钮的 onclick 事件直接以执行代码的方式来调用 form 的 submit 方法,从而触发表单的提交,此种情况不会触发表单的 onsubmit 事件,所以尽管 form 标签中有取消提交的操作,但对该按钮无效,表单还是会正常提交。</label>
11 <br />
12 <br />
13 <input type = "button" value = "普通的 button 按钮" onclick = "document.getElementById('formSubmit').onsubmit();" /><!--这句中的“document.getElementById('formSubmit').onsubmit();”写成“onsubmit();”执行效果也一样,不知道为什么。-->
14 <br />
15 <label>该按钮几乎和上面第二个按钮一样,唯一不用的是点击事件的响应函数中以代码的方式调用了 form 的 onsubmit 方法,而不是 submit 方法,因此此按钮的提交操作也会被 form 标签中 onsubmit 事件的取消提交行为阻止掉,没有提交效果。</label>
16 </form>
细节:
submit 方法不是 form 标签的有效事件,而 onsubmit 则是属于 form 标签的有效事件,但两个都可以在 js 中以 document.getElementById("form1").onsubmit() 或 document.getElementById("form1").submit() 的方式调用(即取出所需提交的form元素,然后“点”出 onsubmit 或 submit 来),其中,“点”出 onsubmit() 方法的前提是在该 form 中必须得有对应的 onsubmit 事件响应函数。
最后总结:
submit 按钮的执行流程包括触发 form 的 onsubmit 事件和提交 form 表单;submit() 方法只会提交 form 表单,不会触发 form 的 onsubmit 事件;而 onsubmit 只是一个事件,里面可以添加相应的事件响应函数,甚至可以用“return false”来终止 submit 按钮触发的提交 form 表单的操作,但在调用 submit() 方法来提交的情况下,此时由于 submit() 方法会跳过“触发 onsubmit 事件”这一步,所以 onsubmit 事件里面的“return false”对此种提交方式毫无影响,表单照样被提交。
课外细节:
1 var content = "sasdf@sdfojai.com";
2 var regex = /(.+)@(\w+\.\w+)/;
3 var result = content.match(regex);
4 for (var i = 0; i < result.length; i++) {
5 alert(result[i]);
6 }
执行了上面的 js 代码后,由运行结果得知,content.match(regex) 后得出的返回值是一个数组,该数组的第一个元素是 content 的值,从第二个开始依次分别是依据每一个组匹配出的值,若不遍历该数组的每一个元素而直接 alert 出来的话,输出显示的格式是“第一个元素(即content)的值,第二个元素的值,...第n个元素的值”。
细节:
在 js 中,btn.disabled = "";表示可用,一旦该值有内容无论内容是什么,都会使控件禁用功能生效,而不一定必须准确填上 "disabled" 才生效(在 IE8 中是这样,其它浏览器环境没有测试过。),例如:btn.disabled = "dis",btn.disabled = "mj",btn.disabled = "aaa"等都会使控件禁用功能生效。