js框架mootools使用实例

一直使用的js框架是jquery，最近因工作的需要开始使用mootools框架，感觉也是非常简单的，这里我介绍一下它的简单的使用，如果大家有兴趣，可以在这里和我一起讨论这个框架的使用。

<script type="text/javascript" src="http://www.aspbc.com/js/mootools.js"></script>
<script type="text/javascript">
//当页面加载完后
window.addEvent('domready',function(){
	//给button按纽绑定ononclick事件
	$('button_test').addEvent('click',function(){
		//获取text1文本框中的值
		var val=$('text1').get('value');
		//给mootools_test赋值
		$('mootools_test').set('html',val);
	});
	$('button_set').addEvent('click',function(){
		$('text1').set('value',6789);
	});
});
</script>
<input type="text" id="text1" value="1234" /><input type="button" id="button_test" value="点击赋值" /><input type="button" id="button_set" value="给文本框赋值6789" />
<div id="mootools_test">点击按纽，将文本框中的文字放到这里来</div>

(鼠标移到代码上去，在代码的顶部会出现四个图标，第一个是查看源代码，第二个是复制代码，第三个是打印代码，第四个是帮助)

这里用到的mootool.js框架的下载地址：http://www.aspbc.com/code/showcode.asp?id=202

我总结一下这个实例的知识点：
1、页面加载完后，执行代码window.addEvent(‘domready’,function(){……})；类似jquery的$(function(){……});
2、给按纽绑定事件 $(‘button_test’).addEvent(‘click’,function(){……})；
3、mootools获取文本框中的value值 var val=$(‘text1’).get(‘value’);
4、mootools给文本框中赋值 $(‘text1’).set(‘value’,6789);
5、mootools给页面改变页面上某个ID中的html内容： $(‘mootools_test’).set(‘html’,val);
以上这5点，是mootools对页面元素操作的基本点，是不是很容易。

原创文章，转载请注明来源asp编程网(www.aspbc.com)，谢谢。