jquery中 怎样获得h1标签中的内容

jquery中 怎样获得h1标签中的内容,第1张

1、新建html文档,在body标签中添加p标签,然后在head标签中引入jQuery文件:

2、在body标签中添加script标签,用jQuery选择器获取p标签,然后用html方法获取标签里面的内容并将结果输出:

3、用浏览器打开html文档,打开浏览器的控制台,可以看到标签中的内容已经被获取到了:

有两种方法可以实现获取span下第一个i标签:

1、使用css选择器: first-child 或nth-child(1),具体代码为:$("spanlabel i:first-child") 或  $("spanlabel i:nth-child(1)")

2、使用遍历方法:first()、eq()等,具体代码为:

$("spanlabel")each(function() {

$(this)find("i:eq(0)")   // 或者$(this)find("i")first()

});

下面进行实例演示:为所有span的第一个i标签的元素都添加红色样式:

1、新建一个HTML文件,为了演示需要假设如下的HTML结构:

<div id="test">

    <span class='label'><i>1-1</i>&nbsp;&nbsp;<i>1-2</i></span><br>

    <span class='label'><i>2-1</i>&nbsp;&nbsp;<i>2-2</i></span><br>

    <span class='label'><i>3-1</i>&nbsp;&nbsp;<i>3-2</i></span>

</div>

<input type="button" id="btn" value="设置">

2、在上面新建文件的开头部分添加如下jquery代码:主要逻辑为在点击按钮时相应一个 *** 作,即获取span下第一个i标签(下面注释部分给出了4种方法都是可行的,可以根据需要进行选择)。为了演示效果,使用addClass()函数为获取到的span下第一个i标签添加红色的样式。

<script>

$(function(){

    $("#btn")click(function() { // 点击按钮就相应下面的 *** 作

        // $("spanlabel i:first-child")addClass('red'); // 方法1,使用first-child选择器

        // $("spanlabel i:nth-child(1)")addClass('red');  // 方法2,使用nth-child(1)选择器

        $("spanlabel")each(function() {

            // $(this)find("i:eq(0)")addClass('red');   // 方法3,遍历后使用eq()方法

            $(this)find("i")first()addClass('red');      // 方法4,遍历后使用first()方法

        });

    });

});

</script>

3、保存文件,使用浏览器打开,点击按钮后效果如下:

代码如下:

var btn = jQuery('btn')val();

获取的只是第一个类标签为btn的html元素的value值。

要获得一组类标签的所有html元素的值。就得使用jQuery的each遍历。

代码如下:

var btns = new Array(); //或者写成:var btns= [];

jQuery('btn')each(function(key,value){

btns[key] = $(this)val();

//或者也可以这么写:

// btns[key] = $(value)val();

});

以上就是关于jquery中 怎样获得h1标签中的内容全部的内容,包括:jquery中 怎样获得h1标签中的内容、jquery 怎么获取span下第一个i标签、JQUERY如何通过VALUE获取标签等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/web/10054509.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-04
下一篇2023-05-04

发表评论

登录后才能评论

评论列表(0条)

    保存