日期:2014-05-16  浏览次数:20370 次

了解javaScript和JQuery做的一些记录
一、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>')