jQuery：選擇具有唯一類和ID的元素

Question

我有這個HTML代碼：

<div class="category" id="154"> Category </div>

<div class="category2" id="156"> Category2 </div>

<div class="category3" id="157"> Category3 </div>

<div class="category4" id="158"> Category4 </div>
<input type="text" />

因此，在示例中，如果我在文本框中編寫一個ID，則如何使用該ID選擇div .category並獲取內部HTML文本。 用jQuery

Answer 1

所以您只需要使用ID，因為這是一個唯一值（或應該是）

var html = $("#154").html();

注意 ：如果確實使用了重復的ID值，則需要注意的是，JQuery將僅選擇第一個。

---

如果要在輸入文本框值時執行此操作，可以在文本框更改事件中執行此操作...

$("input").change(function(){
   var id = $(this).val();
   var element = $("#" + id);
   if(element){
      var html = element.html();
      //do something with html here
   }
});

注意 ：您可能希望在文本框中輸入一個ID值，以確保獲得正確的控件

---

盡管我強烈建議您找到一種使用重復ID值的方法，但是您可以使用類似的功能來獲取所需的DIV。

function GetContent(className, id) {
    var result = null;
    var matchingDivs = $("." + className);
    matchingDivs.each(function(index) {
        var div = $(matchingDivs[index]);
        if (div.attr("id") == id) {
            result = div.html();
        }
    });

    return result;
}

單擊此處查看工作示例

Answer 2

我建議您為文本框指定一個ID，以防在頁面上添加其他文本框。

但是，如果您僅輸入1個文本，則可以使用以下內容：

 var id = $('input:text:first').val();
 var innerHtml = $('#' + id).html();

這是一個jsFiddle ，它將在文本框中的文本更改時使用此技術來警告html。

Answer 3

$("#id.class")

會同時通過class和ID選擇必要的元素（當然，請使用各自的名稱替換id和class ）。

在末尾添加.html()將獲得內容。

即：
$("#id.class").html()