1.上街内容的补充:
1.1innerHTML:(获取子标签及子标签的内容·)
var d1Ele=document.getElementById('d1'); var d1H1=d1Ele.innerHTML; console.log(d1H1); var d1h1=d1Ele.innerHTML=''; console.log('d1h1',d1h1); 结果为: <div>dfhinhji</div> <p>fjinfjk</p> <h1>fjdsin</h1> 01上界内容回顾.js:8 d1h1
1.2输入框时间的问题:(清除有问题)
function foo(){ t1=new Date(); strT1=t1.toLocaleString(); var d1Ele=document.getElementById('i1'); d1Ele.value=strT1; } var t; var startbutton=document.getElementById('start'); startbutton.onclick=function(){ if (t==undefined){ t=setInterval(foo,3000); t=1; console.log(t); } } var stopbutton=document.getElementById('stop'); stopbutton.onclik=function(){ clearInterval(t); console.log('fhjh'); t=undefined; }
今日新内容:jQuery
2.基本选择器:
2.1 id选择器:
$('#d1');
2.2标签选择器:
$('div');
2.3类选择器:
userscript.html?id=3743f8e2-9258-415a-8a6b-6f0849b54fb6:12105 SpeedyPlay Info: waiting... $('.c1');
注如果想要获取具体的某一个元素可以先找到之后在通过索引进行取到:
$('.c1')[0]; <div id="d1" class="c1">我是第一个div</div>
3。其他选择器:
3.1找到所有元素属性的方法:
$('*'); 结果为 0: html 1: head 2: meta 3: title 4: body 5: div#d1.c1 6: div#d2.c1 7: p#p1.c1 8: h1#h1.c1 9: script length: 10 prevObject: k.fn.init [document] __proto__: Object(0)
3.2组合属性,(找到要不满足x和要不满足y的所有元素集合)
$('div,p'); 结果为 0: div#d1.c1 1: div#d2.c1 2: p#p1.c1 length: 3
4.层级选择器:
html程序:
<div id="d1"> <div id="d2">我是div里面的儿子div <div id="d3">我是div里面的孙子div</div> <p>我是div里面的孙子p</p> </div> <p>我是div里面的儿子p</p> <p>我是div里面的儿子p</p> </div>
4.1 x所有后代选择器
$('#d1 div'); 结果为 0: div#d2 1: div#d3 length: 2
4.2x后面所有的儿子选择器:
$('#d1>p'); 结果为 0: p 1: p length: 2
4.3找到紧跟在x后面的y:
$('#d4+p'); 结果为 0: p length: 1
4.4x之后的所有兄弟·:
$('#d5~p'); 结果为 0: p#d4 1: p length: 2
5.js和jQuery的特点去边和转换问题:
5.1js中找到 id=d1的标签:
document.getElementById('d1'); <div id="d1">…</div>
5.2通过jquery找到id=d1的标签:(jQuery在进行变量命名时要在前面加上$);
$('#d1'); 结果为 0: div#d1 length: 1
5.3jQuery对象转换成Dom对象,用索引取出具体的标签:
$('#d4')[0]; 结果为
5.4dom对象转换成jQuery对象,使用$(dom对象)
var d4Ele=document.getElementById('d4'); undefined $(d4Ele); 结果为 0: p#d4 length: 1
6.筛选器:
<div id="d1"> <ul> <li>0</li> <li>0</li> <li>2</li> <li>3</li> <li>4</li> </ul> </div>
6.1选择同一级别标签中的第一个元素:
$('#d1 li:first');
6.2选择同一级标签中的最后一个标签:
$('#d1 li:last');
6.3先要找同一级标签中任意一个标签可以使用下面命令:
$('#d1 li:eq(3)');
6.4也可以找同一级标签中大于某个数以上的标签:
$('#d1 li:gt(3)');
6.5也可以找同一级标签中小于某个数以下的标签:
$('#d1 li:lt(3)');
6.7属于同一个类型标签,但是不想要其中某一个元素的标签(这一个标签有一个独立的特征):(not就是移除不满足条件的)
$('#d1 li:not(.c1)'); 结果为 0: li 1: li 2: li 3: li length: 4
6.8:属于同一个类型标签,但是想要其中某一个元素的标签(这一个标签有一个独立的特征):(has就是找出满足条件的标签)
$('#d3 div:has(a)');
7.属性选择器在表单中的应用:
$('input[name=hobby]');
8.常用的表单删选元素:
1.:text; 2:password; 3: file; 4:radio; 5:checkbox; 6:sumbit; 7:reset; 8:button;
8.1使用方法:$([ ] ) 列子如下:
$('input[type=checkbox]'); 结果为 0: input 1: input 2: input length: 3
9.jQuery的一些基本操作:
9.1找同一级标签中的前面第一个标签:
$('#d3').prev(); 结果为 0: li#d2 length: 1
9.2找同级标签中前面所有的标签:
$('#d3').prevAll(); 结果为 0: li#d2 1: li#d1 length: 2
9.3找同一级标签中的后面第一个标签:
$('#d3').next(); 结果为 0: li#d4 length: 1
9.4找同级标签中前面所有的标签:
$('#d2').nextAll(); 结果为 0: li#d3 1: li#d4 length: 2
9.5找父类标签:
$('#d4').parent();
9.6连着找父类:
$('#d4').parent().parent(); 结果为 0: div#d2 length: 1 prevObject: k.fn
10python中的类也可用链式操作:
class Myteacher: def __init__(self,name): self.name=name def show(self): print(self.name) return self def text(self): print('haha') teacher=Myteacher('alex') teacher.show().text()
11.查找所有的父类:
$('#d4').parents(); 结果为 0: div#d3 1: div#d2 2: div#d1 3: body 4: html length: 5 prevObject:
12查找所有的父类直到:
$('#d4').parentsUntil('#d1'); 结果为 0: div#d3 1: div#d2 length: 2 prevObject: k.
13.查找自己的儿子;也可以用链式:
$('#d1').children();
14.找自己所有的兄弟:(除了自己):
$('#d1').siblings(); 结果为 0: p 1: p 2: script length: 3