0
Я пытаюсь получить текст из элемента, удалить часть строки, добавьте знак вопроса & затем поместить обновленную строку в другой элементJavascript - дополнительное пространство от TextContent
Однако, когда элемент возвращается, разметка создает дополнительное нежелательное пространство до того, как & также помещает знак вопроса в совершенно новую строку внутри элемента.
Это то, что возвращается из журнала консоли
Пример кода
// Set Variables for Dynamic Copy Function
let \t choiceNode = document.querySelectorAll('.choice');
let \t dynamicCopyNode = document.querySelector('.dynamic-copy');
// Update the text type on dynamic copy & append a question mark + remove 'The '
function updateChoice() {
\t let choiceSelected = this.textContent + '?';
\t let choiceSelectedTrim = choiceSelected.replace('The ', '');
\t dynamicCopyNode.textContent = choiceSelectedTrim;
}
// Click listener to trigger the function
Array.from(choiceNode).forEach(function(element) {
element.addEventListener('click', updateChoice);
});<form>
\t <div class="choice-wrapper">
\t \t <div class="choice">
\t \t \t <input type="radio" name="choice" id="one" value="1">
\t \t \t <label for="one">
\t \t \t \t <p class="name">The first choice</p>
\t \t \t </label>
\t \t </div>
\t \t <div class="choice">
\t \t \t <input type="radio" name="choice" id="one" value="2">
\t \t \t <label for="one">
\t \t \t \t <p class="name">The second choice</p>
\t \t \t </label>
\t \t </div>
\t \t <div class="choice">
\t \t \t <input type="radio" name="choice" id="one" value="3">
\t \t \t <label for="one">
\t \t \t \t <p class="name">The third choice</p>
\t \t \t </label>
\t \t </div>
\t \t <div class="choice">
\t \t \t <input type="radio" name="choice" id="one" value="4">
\t \t \t <label for="one">
\t \t \t \t <p class="name">The fourth choice</p>
\t \t \t </label>
\t \t </div>
\t \t <div class="error-wrap">
\t \t \t <label class="error" for="choice" generated="true"></label>
\t \t </div>
\t </div>
\t <div class="copy-wrapper">
\t \t <div class="variable-copy">
\t \t \t <p>Why did you choose</p>
\t \t \t <h1 class="dynamic-copy"></h1>
\t \t </div>
\t </div>
</form>То, что я пытаюсь достичь, это возвращение как так первый выбор?
Вам нужно текстовое содержимое 'p' тега, а не весь дел. –
О, черт побери, я понимаю. Однако, когда я пытаюсь получить ближайший '.name' из щелчка' choice', он возвращает null? – Minum