使用jquery获取HTML元素对应的jquery对象
- var DOM对象=document.getElementById(对象ID)(作用:根据ID获取HTML元素对应的DOM对象);
<html>
<head>
<script language="javascript">
function showa(){
var ida=document.getElementById('a');
alter(ida.innerHTML);
}
</script>
</head>
<body>
<a id="a">aa</a><br>
<a id="b">bb</a><br>
<a id="c">cc</a><br>
</body>
</html>
注意:Dom对象的innerText属性可以获取HTML和设置HTML元素的显示文本;
innerText属性是IE浏览器定义,而innerHTML是w3cshool定义,可以通用,故一般使用第二种。
- var jquery对象=jquery选择器.get(索引);(如果通过选择器选取了多个HTML元素,可以使用get()方法得到其中的一个HTML元素)
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("a").click(function(){
alter($("a").get(0).innerHTML);
});
});
</script>
</head>
<body>
<a id="a">aa</a><br>
<a id="b">bb</a><br>
<a id="c">cc</a><br>
</body>
</html>
- each(回调函数)(遍历jquery选择器所以匹配的元素,并对每个元素执行指定的回调函数,通常回调函数有一个可选的整数参数表示遍历元素的索引)
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(document.body).click(function(){
$("div").each(function(i){
if(this.style.color!="blue"){
this.style.color="blue" ;
}else{this.style.color="";
}
});
});
});
</script>
</head>
<body>
<div>HTML</div>
<div>java</div>
<div>jsp</div>
</body>
</html>
使用jquery获取和设置HTML元素的内容
- html()方法
1. 使用html()方法获取HTML元素的内容 var htmlStr = jquery对象.html();
2.使用html()方法设置HTML元素的内容 jquery对象.html(htmlStr);
- text()方法:
1.使用text()方法获取HTML元素 var htmlStr = jquery对象.text();
2.使用text()方法设置HTML元素 jquery对象.text(htmlStr);
- val()方法:
1.使用val()方法获取HTML元素 var value = jquery对象.val();
2.使用val()方法设置HTML元素 jquery对象.val(value);
3.使用val()方法指定一个函数用于设置HTML元素 $(selector).val(function(index,oldvalue))
$(selector):jquery选择器;
index:可选参数,接受选择器index的位置;
oldvalue:可选参数,接受选择器的当前value属性;