У меня проблема здесь. Я получил этот HTML с вложенными классами. Проблема в том, что мне нужно получить 3 текста из JSON и сделать так, чтобы они отображались в моем html порядке 1-3. Лучшее, что я сделал, - это показал только один из них. Я думаю, что у меня есть проблема с разбором, но я не совсем уверен. Проблема также может быть с "nth-child". Я мог бы использовать любой намек или решение.
Класс "bla", который вы видите, предназначен только для тестирования.
<form method="POST" action="#" id="data-form">
<div class="info">
<div class="input-personal-info">
<div class="info-label">
<label class="info-label-class bla" for="name">
</label>
</div>
<div class="info-input">
<input id="name" class="info-input-class" type="text"
name="Name" placeholder="Enter your name" required>
</div>
</div>
<div class="input-personal-info">
<div class="info-label">
<label class="info-label-class" for="email"></label>
</div>
<div class="info-input">
<input id="email" class="info-input-class"
type="email" name="Mail" placeholder="Enter your Email" required>
</div>
</div>
<div class="input-personal-info">
<div class="info-label">
<label class="info-label-class"></label>
</div>
<div class="info-input">
<input class="info-input-class" type="number"
name="age" placeholder="Age" required>
</div>
</div>
</div>
Это JSON
var json ='
{
"formTitle":"Survey Form",
"letUsnow":"Let us know how we can improve freeCodeCamp",
"info":[
{
"infoPersonalInfo":[
{
"infoLabel":[
{
"text":"<sup </sup>Name:"
},
{
"text":"<sup>* </sup>Email:"
},
{
"text":"<sup>* </sup>Age:"
}
]
}
]
}
],
"roleOptionsLabel":"Which option best describes your current role?",
"reccomendLabel":"<sup>* </sup>How likely is that you would recommend freeCodeCamp to a friend?",
"fccLabel":"What do you like most in FCC:",
"improvedLabel":"Things that should be improved in the future(Check all that apply):",
"commentsLabel":"Comments or Suggestions?"
}
';
А это часть JavaScrpt
var json ='{"formTitle":"Survey Form","letUsnow":"Let us know how we can
improve freeCodeCamp","info":[{"infoPersonalInfo":[{"infoLabel":[{"text":"
<sup>*
</sup>Name:"},{"text":"<sup>* </sup>Email:"},{"text":"<sup>*
</sup>Age:"}]}]}],"roleOptionsLabel":"Which option best describes your
current
role?","reccomendLabel":"<sup>* </sup>How likely is that you would recommend
freeCodeCamp to a friend?","fccLabel":"What do you like most in
FCC:","improvedLabel":"Things that should be improved in the future(Check all
that apply):","commentsLabel":"Comments or Suggestions?"}';
$(document).ready(function(){
var obj = JSON.parse(json);
divTitle(obj);
divForm(obj);
});
function divTitle(obj){
$('.form-title').text(obj.formTitle);
};
function divForm(obj){
$('#paraf').text(obj.letUsnow);
for(i in obj.info){
for(j in obj.info[i].infoPersonalInfo){
for(k in obj.info[i].infoPersonalInfo[j].infoLabel){
var k = parseInt(i) + parseInt(j) + 1 ;
console.log("k:" + k);
//$('.bla').html(obj.info[i].infoPersonalInfo[j].infoLabel[k].text);
$('.info-label:nth-child(' + k + ').info-label-
class').html(obj.info[i].infoPersonalInfo[j].infoLabel[k].text);
}
}
};
Я не получаю никаких ошибок консоли и вывод 3 k: 1
