首頁  >  文章  >  web前端  >  jquery如何取得標籤內容

jquery如何取得標籤內容

藏色散人
藏色散人原創
2020-11-17 10:29:465010瀏覽

jquery取得標籤內容的方法:1、使用「$('#id').val()」方法取得標籤的value值;2、透過「$('#id').text( )」方法取得標籤中間的文字;3、透過「$('#id').html()」方法取得標籤中的html內容。

jquery如何取得標籤內容

推薦:《javascript基礎教學

使用jquery取得標籤的值或元素的內容

$('#标签id').val() 可以用来获取标签的value值,比如 input 标签的value值可以用它获取;
$('#标签id').text()可以用来获取标签中间的文本,比如 值1就可以用它获取到值1;
$('#标签id').html() 可以用来获取标签中间的html内容,比如
123
可以用$('#div1').html()获取到123; $('#标签id').attr('属性名')可以用它来获取标签的指定属性的值,比如xxx就可以用.attr('href')获取到xxx.aspx。 jquery提供了三个获得内容的方法: text()、html() 以及 val(),其中前两个可用于解决本问题: $("label#userid").text(); // 首选,获取label的文本 $("label#userid").html(); // 也可以实现,获取label标签内的所有html标记,一般情况改下label标签内就是文本,所以等效上面的方法

下面給出實例示範:分別使用以上兩種方法取得label標籤的內容,注意最終結果的差異

建立Html元素

点击按钮获取label中内容:

設定css樣式

div.box{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}
div.box span{color:#999;font-style:italic;}
div.content{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}
h3{display:inline-block;}
input[type='button']{height:30px;margin:10px;padding:5px 10px;}

編寫jquery程式碼

$(function(){
$("input:button.btn1").click(function() {
alert($("label#userid").text());
});
$("input:button.btn2").click(function() {
alert($("label#userid").html());
});
})

觀察效果

#使用text()方法取得標籤內的內容

以上是jquery如何取得標籤內容的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn