DOM对象-1

 查找元素
js方法：document.getElementById() 
document.getElementsByTagName()
document.getElementsByClassName()

jquery方法：$(‘#id’)

$(‘div’)

$(‘.class’);
onclick 点击事件 后面跟函数
<div class="c" onclick="l">点击</div>
修改属性

$('.a').text(‘x‘）;修改文字
$('.a').html('<b>x</b>');修改html代码
$('#id').addClass('cur');添加属性，img的id属性再添加一个cur属性
tab切换
<ul>
<li>首页</li>
<li>内容</li>
<li>导航<li>
</ul>
ul li{color：red}
ul li.c{color:yellow}
$('ul li').click(function(){//点击时属性
$(this).addClass('c') ；   //添加class名，removeClass移除class名
});

 改变css样式
function cl(){
document.getElmentById('id').style.height='200px';//js写法
$('#id').css('height','200px');//jq写法，改变单个属性值
$('#id').css({'height':'200px','width':'200px'});
}
文本框里的内容,文本框里本来是zhang，点下点击后改成lisi
<input type="text" name="" id="aa" value="zhang" />
<div class="c" onclick="cl()">点击</div>
function cl(){
document.getElementById('aa').value='lisi';//js
$('#aa').val('lisi');//jq
}
//当文本框的值改变，就会触发事件。onmouseover鼠标移入时触发。onmoseout鼠标移开时触发
<input type="text" name="" id="aa" value="zhang" onchange=“change（）” />
<div class="c" onclick="cl()">点击</div>
function change(){
console.log（1）；
}
点击时显示具体点击哪一个，可以写鼠标移入颜色
<ul>
<li onclick=“cl（this）”>首页</li>
<li onclick=“cl（this）”>产品</li>
<li onclick=“cl（this）”>新闻</li>

</ul>

function cl（that）{

$(that).addClass('cur');

}

点击id名为aa属性时出现弹框hello

<input type="text" name="" id="aa" value="" />

<div class="c" >点击</div>

//js写法
document.getElementById('aa').onclick=function(){
alert('hello')
}

jq写法

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

alert('hello');})

点击li标签时，弹框出现hhh

//js
// var j= document.getElementsByTagName('li').length
// for(i=0;i<j;i++){
// document.getElementsByTagName('li')[i].onclick=function(){alert('hhh');}
// }