자바 스크립트 getElementsByTagName - 포함 된 요소 포함

-4

인터넷의 자바 스크립트 조각을 사용하여 div id 'footnotes'내의 모든  요소를 수집하고 링크와 뒤로 문서 목록 끝에 순서가 지정된 목록으로 추가합니다. 링크 (즉, 쉬운 HTML 각주), Footnotes.js :자바 스크립트 getElementsByTagName - 포함 된 요소 포함

var DOMsupport = document.getElementsByTagName && document.createElement; 

window.onload = function() { 
    if (!DOMsupport) return; 

    var footNoteHolder = document.getElementById('footnotes'); 
    var allNotes = footNoteHolder.getElementsByTagName('small'); 
    var notesList = document.createElement('ol'); 

    notesList.className = 'notesList'; 

    for (var i = 0; i < allNotes.length; i++) { 
     var newA = document.createElement('a'); 
     newA.id = 'text-' + (i + 1); 
     newA.setAttribute('href', '#footnote-' + (i + 1)); 
     newA.setAttribute('title', 'Jump to footnote'); 
     newA.appendChild(document.createTextNode((i + 1))); 

     newBackLink = document.createElement('a'); 
     newBackLink.id = 'footnote-' + (i + 1); 
     newBackLink.setAttribute('href', '#text-' + (i + 1)); 
     newBackLink.setAttribute('title', 'Back to text'); 
     newBackLink.appendChild(document.createTextNode('[back]')); 

     newNote = document.createElement('li'); 
     newNote.appendChild(document.createTextNode(allNotes[i].firstChild.nodeValue + ' ')); 
     newNote.appendChild(newBackLink); 
     notesList.appendChild(newNote); 

     allNotes[i].replaceChild(newA, allNotes[i].firstChild); 
    } 
    footNoteHolder.appendChild(document.createElement('hr')); 
    footNoteHolder.appendChild(notesList); 
}

나는 단순 시야에 jQuery를 좋아하지만 라인이   나누기 및/또는 일부 내부 <a href="https://www.ncbi.nlm.nih.gov/pubmed/27827297">Click for PubMed</a> 링크 포함 할 수 있도록하고 싶습니다 각주.

 태그 안에 다른 요소를 포함 시키려고하면 텍스트가 본문에 배치되며 끝에 모아서 배치되지 않습니다. 예 : 잘 모르겠어요

<!DOCTYPE HTML> 
<html> 
<head> 
<title>MDT Home</title> 
</style> 
<script type='text/javascript' 
    src='..\..\js\footnotes.js'> 
</script> 
</head> 
<body> 
<span id='footnotes' ><br> 

<h2>Welcome to the MDT site<br></h2><br> 
I have designed the site in a minimalist style using <a href='https://www.lua.org/' title='Lua'>Lua</a> it should run on all trust machines.<br> 
<br> 
To use the menu click the icon at the top left. If you have a modern browser you can use keyboard shortcuts [<small> 
Alt-M: Menu.<br> 
Alt-H: MDT Home.<br> 
Alt-K: Hip and Knee.<br> 
Alt-A: Foot and Ankle.<br> 
Alt-W: Wrist and Hand.<br> 
Alt-S: Shoulder and Elbow.<br> 
Alt-I: Spine.<br> 
Alt-C: Children.<br> 
</small>] e.g move to menu by entering Alt-M. 
Please read the terms of use before proceeding to review patient data. <br> 

<br></span> 
</body> 
</html>

문제는 NodeList를 객체를 생성 getElementsByTagName('small')를 사용 allNotes의 선택에있다, 또는 newNote의 건물이 allNotes[i].firstChild.nodeValue + ' '를 사용하여 문제가있는 경우.

죄송합니다.이 조각의 원본 원본을 더 이상 제공하지 않습니다. 일반적으로 작성자에게 신용을 부여하고 직접 물어 봅니다. 이상적인 세상에서는 조각을 도려내고 내 페이지에 붙여 넣는 대신 자바 스크립트를 올바르게 배울 것입니다.

도움을 주신 모든 도움. 나는 내 각주의 요소를 가질 수없는 이유를 찾기 위해이 코드의 각 행을 검토 한 비판에 박차를 가해

개빈

출처

2016-11-10 Gavin

배우기가 그다지 어렵지 않으므로 코드 작성의 자유를 누릴 수 있습니다. –

보유하고있는 코드로 판단하고 추가 할 항목을 이미 알고 있다면 요구 사항에 맞게 새 코드를 추가 할 수 있어야합니다. David이 말했듯이 진행 방법을 모른다면 코드가하는 일을 배우는 데 시간을 할애해야합니다. [document.appendChild] (http://www.w3schools.com/jsref/met_node_appendchild.asp)에 대한 자료는 좋은 시작입니다. –

귀하의 질문이 무엇인지 완전히 명확하지 않습니다. 이 제목을 통해 태그 이름으로 요소를 가져오고 포함 된 요소를 가져올 때 각 요소를 가져 오는 것이 좋지만 그 다음에는 각주에 무언가를 추가하는 방법에 대해 설명합니다. 문제가 실제로 무엇인지 말하는 곳은 어디에도 없습니다. [ask]를 읽고 질문 자체에 배치 할 [mcve]를 만드는 방법을 살펴보십시오. –

It appears you can't have elements within TextNodes. 코멘트에 공헌 한 토마스 씨가 잘 알고있는 게시물.

요소가 있거나 없을 수도있는 부분을 조합하는 대체 메커니즘을 찾기 위해 Javascript를 배우지 않겠습니다. 좋은 자바 비트가 있다는 것을 알고 있지만 DOM 코딩은 그 중 하나가 아닌 것 같습니다.

출처

2016-11-11 11:39:23 Gavin

자바 스크립트 getElementsByTagName - 포함 된 요소 포함

답변

관련 문제