toggleClass添加取消

1.链式编程（$（'#add'））.click().dbclick())

2.加载，onload

　　js中，在body中添加onload事件，调用js方法

　　window.onload=function(){},覆盖上一个

　　onload只能这个注册一次，而ready就可以多次注册

　　$(document).ready(function(){})

　　$(function(){})

　　$(window).load()

onload是所有DOM元素创建、图片加载完毕后才触发的，而ready则是DOM元素创建完毕后触发的，不等图片加载完毕，图片还没有渲染，就可以进行事件的执行

Jquery内置函数，js中有数组

　　$map(array,fn),每个元素调用函数fn

　　　　var array=[1,5,9]

　　　　var array2=$map(array,function(item){return item*2})

　　$each

　　　　var a={'name':'tom','age':18}

　　　　var b=$each{a,function(key,vale){})普通数组，可以为就是序号

　　　　var array=[1,5,9]

　　`　　$each(array,function(){alert(this)}） this表示遍历的每个元素

5.jquery封装dom

　　$('#div_id').html() 一样的效果一句

　　doucument.getElementById('#div_id').innerHTML(获取id为div_id的inner的值)

6.dom对象转换为jquery对象，${dom.对象} 举例：this

　　domobj=jqobj[0] domobj=jqobj.get{0}

<div id='div_id' class='green' onclick=Go(this);'>content</div>

#转换jquery选择器

function Go(arg){

　　$('arg).text('11111') #多个元素都有同样的函数这样写一个函数就可以

}

7、jquery修改样式：$().css('width','100px'),获取则不加最后一个参数

　　修改value $().val(***)

　　获取 $().val()

　　innerText $().text()

　　innerHtml $().html()

function Go(arg){

　　v=$(arg).val();

　　alert(v);}

8.Jquery选择器：

　　$('#div') #所有id

　　$('div') 所有idv标签

　　$('.class') class的值

举例取多个class相同的值：

<body>

</body>

　　$(function(){

　　　　$('.vvv').click(function(){

　　　　　　value=$(this).val();

　　　　　　alert(value);}

</script>

9.多条件选择器

　　$('p,div,span.class')所有的p、div span的class属性

　　$('div li')所有的子元素子子、子子子（一定要有空格）孙子有也可以获取

　　$('div >li')直接子元素

　　$('.class+div ') class之后的第一个div

　　$('.class~div ') class之后的所有div

10.迭代

　　选择器选中多个后，调用text html click等方法，会迭代给每个元素

11.Next

　　用于获取节点之后的第一个同辈元素

　　nextAll获取所有的同辈元素 nextAll.css('background-color','red')

12 Siblings

　　获取所有其他同辈元素（同一等级的元素）兄弟元素

举例:

<body>

　　<ul id='tab-menu-title> 点时当前current为白色，其他为灰色

　　<ul>

</div>

<div content='1'>content1</div>

<div content='2' class='hide'>content2</div>

<div content='3' class='hide'>content3</div>

</div>

</body>

$(function(){

　　ChangeTab('#tab-menu-title,'#tab-menu-body');

})

function ChangeTab(title,body){

　　$(title).children().bind('click',

　　function(){

　　$menu=$(this);

　　$content=$(body).find(

　　'div[content="'+$(this).attr("content-to")+'"]');

　　$menu.addClass('current').siblings().removeClass('current');

　　$content.removeClass('hide').siblings().addClass('hide');

)};

}</script>

链式编程实例：

</script>

　　.red{

　　　　background-color:red;

　　}

　　.blue{

　　　　background-color:blue;

　　}

</style>

　　$(function(){

　　　　$('#div_id').click(function(){

　　　　　　$(this).toggleClass("blue");

　　　　})

</script>

<body>

　　<div id='div_id class='red'>content</div>

</body>

（fuction)=doucument.ready

posted @ 2019-03-23 19:27 期待me 阅读(94) 评论(0) 收藏举报

刷新页面返回顶部

toggleClass添加取消

公告