一、javaScript
1、prompt方法
主要用处是:显示提示对话框。
用法:prompt(message,defaulttext)
message 是提示信息
defaulttext 是要输入的值。也可以不输入值,如果不输入值,则返回null。
2、事件的监听
ie中事件的监听及删除
object.attachEvent("onclick",functionName)
object.detachEvent("onclick",functionName)
DOM规范的浏览器如:firefox
object.addEventListener("click",functionName,false);
object.removeEventListener("click",functionName,false);
//第三个参数false表示的是采用冒泡型事件 true为捕获型事件
ie浏览器中事件对象是window对象的一个属性event
object.onclick = function(){
var oEvent = window.event;
}
DOM中规定event对象必须作为唯一参数传给事件处理函数
object.onclick = function(oEvent){
//...
}
为了兼容浏览器,通常采用如下方法:
object.onclick = function(oEvent){
if(window.event) oEvent = window.event;
}
3、错误调试
window.onerror事件
try{}catch(exception){}语句,例
try{
//...
}catch(exception){
var sError = "";
for(var i in exception){
sError += i + ":" + exception[i] + "\n";
}
}
4、调试器
firefox错误控制台
Microsoft Script Debugger
5、表单控制
textarea输入字符个数的控制:
<textarea name="comments" id="comments" cols="50" rows="5" maxlength="50"
onkeypress="return LessThan(this);"></textarea>
<script>
function LessThan(oTextArea){
return oTextArea.value.length < oTextArea.getAttribute("maxlength");
}
</script>
二、css
div标记不同行---整体进行换行
span标记同一行---行内标记
z-index 空间坐标
三、dom
1、访问节点
getElementsByTagName
getElementById
四、ajax
创建异步对象
var xmlHttp;
function createXMLHttpRequest(){
if(window.ActiveXObject)
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
else if(window.XMLHttpRequest)
xmlHttp = new XMLHttpRequest();
}
建立请求
xmlHttp.open("GET",url,true)
第三个参数true表示异步交互
异步对象连接服务器
onreadystatechange事件
xmlHttp.onreadystatechange = function(){
if(xmlHttp.readyState == 4&&xmlHttp.status==200)
//...
}
send()发送
xmlHttp.send(null);
GET提交方式send(null)、POST方式send(requestURL)
五、jquery
注:引用jquery.js的连接必须放在其他js以用的上面
**属性选择器,jquery使用了XPath中的惯例来标识属性,即将属性前置一个@符号并放在一对方括号中。
例如,要选择所有带title属性的链接,可以使用下面的代码:
$('a[@title]')
此外,方括号在XPath语法中还有另外一种用途,即在不带前置@符号的情况下,可以用来指定包含
在另一个元素中的元素。例如,可以通过下面的选择符表达式,去的包含一个ol元素的所有div元素:
$('div[ol]')
1、事件操作
1.1、this关键字在jquery中引用的是DOM对象,而不是jquery对象,所以可以使用原生的DOM属性
来确定被单击元素的ID,如:
$(document).ready(function(){
$('#switcher .button').bind('click',function(){
$('body').removeClass();
if(this.id == 'switcher-narrow'){
$('body').addClass('narrow');
}
});
});
1.2、简写事件方法
简写事件方法的原理与对应的.bind()调用相同,如:
$('#switcher .button').click(function(){
//...
})
1.3、复合事件
.toggle(fn, fn2, [fn3, fn4, ...])
每次点击后依次调用函数。如果点击了一个匹配的元素,则触发指定的第一个函数,当再次
点击同一元素时,则触发指定的第二个函数,如果有更多函数,则再次触发,直到最后一个。随
后的每次点击都重复对这几个函数的轮番调用。 可以使用unbind("click")来删除。
1.4、其他
冒泡型事件容易出现一些意外的错误,用如下的函数可以屏蔽这个问题:
通过.target可以确定DOM中首先接收到事件的元素(即实际被单击的元素)
$('#switcher .button').click(function(event){
if(event.target == this){
//...
}
})
.stopPropagation()可以完全阻止事件冒泡
$('#switcher .button').click(function(event){
//...
event..stopPropagation();
})
.preventDefault()可以终止默认操作,如表单enter按钮默认的submit事件。
对于只需要发生一次的事件用.one()函数;
模拟事件操作----.trigger()函数
$(document).ready(function(){
$('#switcher').trigger('click');//简写$('#switcher').click();
});
2、DOM操作
2.1、插入操作
.insertBefore()和.before()方法作用相同,但是在使用.before()方法时,(.insertAfter()和.after()相同),必须把选择器表
达式放在这个方法前面。如:
$('div.chapter p').after('<a href="#top">back to top</a>')