Javascript 使用Jquery解析div标记中的数据

我有如下HTML：

<div data-suppattrtype="test1" class="testclass">
  <p>
    Hello Test1
  </p>
</div>
<div data-suppattrtype="test2" class="testclass">
  <p></p>
    <div class="LotMoreContents">
      <p>
        First Time
      </p>
      <div id="Time">
        <input type="text" id="start-time" value="123"/>
        <input type="text" id="end-time" value="456"/>
      </div>
      <p>
        Second Time
      </p>
      <div id="Time">
        <input type="text" id="start-time" value="789"/>
        <input type="text" id="end-time" value="012"/>
      </div>
    </div>

</div>

为此，我可以通过以下方式获取test2的innerHTML：

$( document ).ready(function () {
  var $allDivs = $(this).find(".testclass");
  $allDivs.each(function() {
    var $suppAttrType = $(this).data('suppattrtype');
    if($suppAttrType === "test2") {
        /*Parse the the time objects within test2*/
    }
  });
});

我可以通过

$（this）[0]

访问HTML，但我无法进一步操作。

首先

您应该只为页面唯一的元素分配

id

。否则，使用

class

（正如我在下面的代码片段中修改的那样）

id=“Time”

到

class=“Time”

，

id=“start Time”

到

class=“start Time”

和

id=“end Time”

到

class=“end Time”

秒

您需要

JSON.stringify（）

函数将JavaScript值转换为JSON字符串

$( document ).ready(function () {
  var $serializedTimes = [];

  var $allDivs = $(this).find(".testclass");
  $allDivs.each(function() {
    var $suppAttrType = $(this).data('suppattrtype');
    if($suppAttrType === "test2") {
      $(this).find(".Time").each(function(){
        var startTime = $(this).find(".start-time").val();
        var endTime   = $(this).find(".end-time").val();

        $serializedTimes.push({startTime: startTime, endTime: endTime});
      });
    }
  });

  console.log(JSON.stringify($serializedTimes));
});

$（文档）.ready（函数（）{
var serializedTimes=[]；
$（“.testclass[data suppattrtype='test2']”）。每个（函数（）{
$（this.find（“.Time”）.each（function（）{
var startTime=$（this.find（“.start time”）.val（）；
var endTime=$（this.find（“.end time”）.val（）；
serializedTimes.push（{startTime:startTime，endTime:endTime}）；
});
});  
log（JSON.stringify（serializedTimes））；
});


你好，测试1



第一次


第二次

您是否正在尝试获取
输入元素的值？如果您将它们的ID更改为唯一的，您可以使用
$（'input#first start time'）.val（）
来获取值。是否只有在属性为test2时才可以这样做？我的意思是，是否可以使用var myContent=$（this）.data（'supattrtype'）；myContent变量？因为我只想针对div的这一部分，在其他代码块中也可能存在类似的标记。你们是什么意思？我不明白。在myContent中，我有HTML对象，对吗？是否可以只在其中搜索时间属性$（“.testclass[data suppattrtype='test2']”）将在整个html文件中搜索，对吗？我更喜欢在我已经检索到的内容中搜索时间是的。它将搜索具有类名
testclass
和
data-suppatrttype
test2
的所有元素。但是
$（this）.find（.Time”）。每个（
都将在元素
testclass
和
数据类型
test2
中搜索。您的
var$allDivs=$（this）.find（.testclass”）；
也将检索整个HTML文件。
$( document ).ready(function () {
  var $serializedTimes = [];

  var $allDivs = $(this).find(".testclass");
  $allDivs.each(function() {
    var $suppAttrType = $(this).data('suppattrtype');
    if($suppAttrType === "test2") {
      $(this).find(".Time").each(function(){
        var startTime = $(this).find(".start-time").val();
        var endTime   = $(this).find(".end-time").val();

        $serializedTimes.push({startTime: startTime, endTime: endTime});
      });
    }
  });

  console.log(JSON.stringify($serializedTimes));
});