当前位置:asp编程网>技术教程>Javascript教程>  正文

js框架mootools使用实例

1970-01-01 08:00:00   来源:www.aspbc.com    作者:wangsdong   浏览量:3115   收藏

一直使用的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),谢谢。



关于我们-广告合作-联系我们-积分规则-网站地图

Copyright(C)2013-2017版权所属asp编程网