jquery手记

qsrock

浏览: 420866 次
性别:
来自: 广州

最近访客更多访客>>

痞夫balabala

sunny4396

bayuan0414

孙邵聪

博主相关

博客

微博

相册

留言

关于我

文章分类

社区版块

存档分类

博客分类：

javascript

jQuery 正则表达式 Firefox HTML

JQuery拿取对象的方式
$(‘#id’) ：通过元素的id
$(‘tagName’) : 通过元素的标签名
$(‘tagName tagName’) : 通过元素的标签名,eg: $(‘ul li’)

$(‘tagName#id): 通过元素的id和标签名
$(‘:checkbox’):拿取input的 type为checkbox’的所有元素:
Eg: <input type="checkbox" name="appetizers"
value="imperial"/>

$('span[price] input[type=text]') ：拿取下面的input元素

<span price="3">
<input type="text" name="imperial.quantity"
disabled="disabled" value="1"/>
</span>

$('div',$(this).parents('div:first'))：拿取该div的上（至少都是父节点）的第一个div节点

$('~ span:first',this)： locates the first sibling of this that’s a <span> element.

延迟加载js文件：
$.getScript

例子：
Html文件:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>$.getScript Example</title>
    <link rel="stylesheet" type="text/css" href="../common.css">
    <script type="text/javascript"
            src="../scripts/jquery-1.2.1.js"></script>
    <script type="text/javascript">
      $(function(){
        $('#loadButton').click(function(){
          $.getScript(//在Firefox/3.0.1中会出现一个错误(语法错误,定义的变量不起作用,ff2没问题)
            'new.stuff.js'//,function(){$('#inspectButton').click()}
          );
        });
        $('#inspectButton').click(function(){
          someFunction(someVariable);
		  test()
        });
      });
    </script>
  </head>

  <body>
    <button type="button" id="loadButton">Load</button>
    <button type="button" id="inspectButton">Inspect</button>
  </body>
</html>

Js文件:

alert("I'm inline!");

var someVariable = 'Value of someVariable';

function someFunction(value) {
  alert(value);
}

function test() {
  alert('test');
}

jquery数组处理：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>Hi!</title>
    <script type="text/javascript" src="../scripts/jquery-1.2.1.js">
    </script>
    <script type="text/javascript">
      var $ = 'Hi!';
      jQuery(function(){
        alert('$ = '+ $);//这里的 $ 为 Hi!,把它变回jquery的符号:jQuery(function($){...}/这样就可以了
		//alert(jQuery)

      });
	  jQuery(function($){
		//------------遍历数组 .each的使用-------------
		var anArray = ['one','two','three'];
		$.each(anArray,function(n,value) {
			//do something here
			//alert(n+'  '+value);
		});
		var anObject = {one:1, two:2, three:3};
		$.each(anObject,function(name,value) {
			//do something here
			//alert(name+'  '+value);
		});

		//-----------过滤数组 .grep的使用------------
		var originalArray =[99,101,103];
		/*//第一种写法
		var bigNumbers = $.grep(originalArray,function(value) {
			return value > 100;
		});
		*/
		var bigNumbers = $.grep(originalArray,'a>100');//第2种写法,还可以用正则表达式来过滤
		$.each(bigNumbers,function(n,value) {
			//do something here
			//alert(n+'  '+value);
		});

		//------------转换数组  .map的使用------------
		var strings = ['1','2','3','4','S','K','6'];
		var values = $.map(strings,function(value){
			var result = new Number(value);
			return isNaN(result) ? null : result;//如果result不是数字则 返回null（返回null在这里相当于不返回）
		});
		$.each(values,function(n,value) {
			//do something here
			//alert(value);
		});

		var characters = $.map(
			['this','that','other thing'],
		function(value){return value.split('');}//分离字符串用返回给characters
		);
		//alert(characters.length);

		//------------.inArray(value,array)的使用------------返回value在array下标的位置，如果value不在array中则返回-1
		var index = $.inArray(2,[1,2,3,4,5]);
		//alert(index);

		//------------makeArray(obj)的使用------------将类数组对象转换为数组对象。
		var arr = jQuery.makeArray(document.getElementsByTagName("div"));
		//arr.reverse(); // 使用数组翻转函数 
		$.each(arr,function(n,value) {
			//do something here
			//alert(n+'  '+value);
			//alert(value.html());
		});
		var arr2 =$.unique(document.getElementsByTagName("div")); //获得唯一的对象，看API,说得很模糊,http://docs.jquery.com/Utilities/jQuery.unique
		alert();
		$.each(arr2,function(n,value) {
			//do something here
			alert(n+'  '+value);
		});
	  });
    </script>
  </head>
  <body>
	<div>First</div><div>Second</div><div>Third</div><div>Fourth</div><div>Fourth</div>
  </body>
</html>

分享到：

SQL行列转换 | jslt 标签函数，和选择标签的简单使用

2008-09-12 14:03
浏览 2642
评论(0)
查看更多

发表评论

您还没有登录,请您登录后再发表评论

最近访客更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

jquery手记

评论

发表评论

相关推荐

最近访客 更多访客>>

博主相关

文章分类

社区版块

存档分类

最新评论

jquery手记

评论

发表评论

相关推荐

javascript url 传递参数中文乱码问题解决方案

javascript创建节点div时，设置float属性不能生效

关于javascript的Array对象

javascript离开当前页面就出发事件

用javascript向多选框添加监听事件！

(网页一开始就加载)用JS弹出网页对话框后，后面那一层变灰，变成不可操做。

替代全角和半角括号的方法示例

javascript中的各种输入限制

有关层定位、显示、隐藏的例子

想把某些内容固定在某些地方总是显示当前页面上

css细线表格

css细线表格

用JS弹出网页对话框后，后面那一层变灰，变成不可操做。

javascript+CSS下拉菜单演示

javascript 显示剩余的时间

javascript屏蔽按健

javascript时间差

window.open() 父子页面的传参&传值问题

firefox并不支持selectSingleNode和selectNodes的解决方法

IE和firefox中的一些javascript总结

最近访客更多访客>>