jquery 根据class名 赋值_jquery 赋值 创建元素 添加class属于 html内容

1. 选择器

在html里，我们可以使用网页特效选择一个html标记进行操作，比如修改html标记的属性，添加一个class属性等等。使用jquery选择一个html标记更加容易

1)通过html的id属性选择一个html标记

var id = jquery("#id3");

id.html("hahaha");

以上代码中 得到一个div 标记，并为这个标记的内容赋值hahaha，之所以得到这个标记是因为这个标记的id等于id3

2) 通过元素名称选择

var ids = jquery("div");

alert(ids);

///

aa

bb

以上代码得到一个数组，数组中的元素是2个div标记

3) 通过元素的class属性选择元素

4) 通过* 可以选择所有的元素

5) 通过元素 子元素来选择元素

例如:

jquery("div li"); // 得到div元素下面的li子元素

jquery("div li:has(a)"); // 得到div元素下面的li子元素,and 这些子元素是有标记的子元素 ,例如:

只得到第一个li

jquery("div:eq(0)"); // 得到第一个div元素

jquery("div:lt(2)">; // 得到前两个div

jquery("div:last(0)"); // 得到后div

2. 去除首位空格

var s = jquery.trim("sss ");

3. window.onload = mybegin 的作用是当文档加载完成执行mybegin函数，但这句只能写一次，如果要执行多个函数，使用jquery：

jquery(document).ready(function(){});

这句还可以写成：jquery(function(){});

4. 创建元素

var se = jquery("...."); // 创建了一个select元素

se.insertbfter("#id"); // 将新建的元素追加到div2元素后面

5. 得到元素的属性

$("div").attr("title");

6. 设置元素属性

$("div").attr("title", "helo");

7. 添加class属于

$("div:eq(1)").adddlass("myclass1");

为第二个div元素添加一个class="myclass1"

8. 切换class属性

$("div").toggledlass("hight");

如果div元素有class=hight属性,则删除,如果没有则添加之

9. 获得元素文本的内容

$("div").text();

10. 获得元素html内容

$("div").html();

11. 为元素添加html内容

$("div").html("......");

12. 克隆元素

$("div").clone();

得到此元素的一个副本.

$("div").clone().appendto($("p"));

将div元素的一个副本追加到p元素

13. 为元素添加事件

$("div").click(function(){});

// 为div元素添加了一个click事件,当触发该事件时,执行function函数

$("div").bind("click", function(){});

// 为div元素绑定一个click事件

$("div").bind("click", fn = function(){});

// 为div元素绑定一个click事件

$("div[@id=d]").click(function(event) {

alert(event.clientx)

});

// 为div(并且div的id="d")添加一个click事件,事件处理函数中得到鼠标坐标

14. 移除事件

$("div").unbind("click", fn); //fn为函数名

15. 显示元素

$("div").show();

$("div").show(毫秒); // 使用"毫秒"时间将div显示出来

16. 隐藏元素

$("div").hide();

$("div").hide(毫秒);

17. 元素隐藏和显示

还有:

$("div").fadeout();

$("div").fadein();

18. 幻灯片

$("div").slideup();

$("div").slidedown();

19. 浏览器检测

$.browser 下有多个属于,可以用来判断浏览器的类别

msie true表示ie

mozilla true表示mozilla系列,比如firefox

safari true表示safari

opera true表示opera

version 得到浏览器的版本

if ($.browser.mozilla)

{

....

}

20. 盒子模型

盒子模型分为w3c标准模型和ie非标准模型

我们介绍标准模型

是浏览器的区域,element是内容区域,他有width属性和height属性,padding是内容区域到tag边框的距离,称内边距,margin是element边框的浏览器边缘的距离,称外边距

判断盒子模型的类型

$.bomodel 可以判断盒子模型,true为标准w3c boxmodel

这句建议使用 $.support.bomodel 替代

21. 遍历对象

$.each(array, fn);

// 遍历array(集合),每遍历一次,执行一次fn.

$.each($.browser , fn(p,v){...});

// 遍历browser中的所有属性,fn函数的参数p表示属性名称,v表示属性值.

对数组进行过滤

$.grep(array , fn(v,index){...});

遍历array中的元素,每遍历到一个元素执行一次fn函数. fn函数的第一个参数为array中遍历到的元素,第二个元素为index, 这个fn函数必须返回true/false,如果返回true,则保留遍历到的这个元素,如果返回false则删除此元素.

例子:

var ss = $.grep([1,2,3,4] , function(o){

return o > 2;

});

alert(ss); // 打印出大于2的元素.

22. map()

我总觉得这个map函数和each一个意思,还是不理解

$.map(array , fn);

23. 异步请求

$.get(url, {data} , fn(data){...});

$.post(url, {data}, fn(data){...});

$.ajax(options);

例子:

$.ajax( {

type : 'post',

url : '....',

data : {name:'11', age:'22'},

success : fn(data){}

} );

其中{data} 是json格式的数据,表示url的参数