了解javaScript和JQuery做的一些记录
一、javaScript 1、prompt方法主要用处是:显示提示对话框。 用法:prompt(message,defaulttext) message 是提示信息 defaulttext 是要输入的值。也可以不输入值,如果不输入值,则返回null。 2、事件的监听ie中事件的监听及删除object.attachEvent("onclick",functionName)object.detachEvent("onclick",functionName)DOM规范的浏览器如:firefoxobject.addEventListener("click",functionName,false);object.removeEventListener("click",functionName,false);//第三个参数false表示的是采用冒泡型事件 true为捕获型事件ie浏览器中事件对象是window对象的一个属性eventobject.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 Debugger5、表单控制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>')