使用jQuery操作HTML元素（1）

最新推荐文章于 2021-06-28 23:02:25 发布

我的1024

最新推荐文章于 2021-06-28 23:02:25 发布

阅读量280

点赞数

本文链接：https://blog.csdn.net/qq_40399835/article/details/84567997

版权

使用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属性；

我的1024

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
使用jQuery操作HTML元素（1）

使用jquery获取HTML元素对应的jquery对象var DOM对象=document.getElementById(对象ID)（作用：根据ID获取HTML元素对应的DOM对象）；&lt;html&gt;&lt;head&gt;&lt;script language="javascript"&gt; function showa(){ var ida=doc...
复制链接

扫一扫