Question

我想知道如何获取给定div中的文本，同时将输入的值作为文本。

<div id="example">This is a <input type="text" value="right"/> test.</div>

如果我只是尝试使用jQuery获取这样的文本：

$("#example").text();

结果将是This is a test.，我想要：This is a right test. 输入的数量是未知的。以及元素的顺序......

编辑：我终于解决了自己的问题：

var finalText="";
   $("#example").contents().filter(function() {
        if(this.nodeType==3){ finalText =finalText+ this.nodeValue;}
        else if(this.nodeName=="INPUT"){ finalText=finalText+this.value;}
           return finalText
    })

The living example

但是@Jonathan Lonowski answer比我的更清晰，更简单！

Answer 1

这是一个快速插件，可以为您执行此操作：

$(document).ready(function() {

   $.fn.extend({
        getContentText: function() {
          var t = '';
          this.contents().each(function(i,c) {
              var method = $(c).is("input") ? "val" : "text";
              t += $(c)[method]();
          });
          return t;
        }
    });

    alert($("#example").getContentText());

});

在这里试试： http://jsfiddle.net/wQpHM/

Answer 2

您可以尝试克隆，以便replaceWith输入值及其值。然后按原样抓取文本：

var clone = $('#example').clone();

clone.find(':input').replaceWith(function () {
    return $(this).val();
});

alert(clone.text());

Answer 3

您可以循环遍历<div>的所有子项，然后将其替换为其值。像这样：

$.fn.allText = function(){
    var $this = this.clone();
    $this.children().each(function(){
        $(this, $this).replaceWith(this.value);
    });
    return $this.text();
};

alert($('#example').allText());

演示：http://jsfiddle.net/4mGmH/

Answer 4

使用innerText

document.getElementbyId('example').innerText;

获取HTML标记： -

document.getElementbyId('example').innerHTML;

请参阅此网址element.innerHTML

Answer 5

获取html和strip html标签

$('#example')[0].innerHTML.replace(/(<([^>]+)>)/ig, '').replace(/(\s+)/g, ' ')

如何使用它的输入值获取div文本

5 个答案: