>

제목을위한 문자열과 링크를위한 문자열이 있습니다. Javascript를 사용하여 페이지에 링크를 만들기 위해 두 가지를 함께 묶는 방법을 모르겠습니다. 도움을 주시면 감사하겠습니다.

EDIT1 : 질문에 더 자세한 내용 추가. 내가 이것을 알아 내려고하는 이유는 RSS 피드가 있고 제목과 URL 목록이 있기 때문입니다. 페이지를 유용하게 만들기 위해 제목을 URL에 연결하고 싶습니다.

EDIT2 : jQuery를 사용하고 있지만 완전히 새로워 서이 상황에서 도움이 될 수 있다는 것을 몰랐습니다.


  • 답변 # 1

    <html>
    <head></head>
    <body>
    <script>
    var a = document.createElement('a');
    var linkText = document.createTextNode("my title text");
    a.appendChild(linkText);
    a.title = "my title text";
    a.href = "http://example.com";
    document.body.appendChild(a);
    </script>
    </body>
    </html>
    
    

  • 답변 # 2

    JavaScript 사용 <올>

    var a = document.createElement('a');
    a.setAttribute('href',desiredLink);
    a.innerHTML = desiredText;
    // apend the anchor to the body
    // of course you can append it almost to any other dom element
    document.getElementsByTagName('body')[0].appendChild(a);
    
    

    document.getElementsByTagName('body')[0].innerHTML += '<a href="'+desiredLink+'">'+desiredText+'</a>';
    
    

    또는 @travis가 제안한대로

    document.getElementsByTagName('body')[0].innerHTML += desiredText.link(desiredLink);
    
    

    <script type="text/javascript">
    //note that this case can be used only inside the "body" element
    document.write('<a href="'+desiredLink+'">'+desiredText+'</a>');
    </script>
    
    

    JQuery 사용 <올>

    $('<a href="'+desiredLink+'">'+desiredText+'</a>').appendTo($('body'));
    
    

    $('body').append($('<a href="'+desiredLink+'">'+desiredText+'</a>'));
    
    

    var a = $('<a />');
    a.attr('href',desiredLink);
    a.text(desiredText);
    $('body').append(a);
    
    

    위의 모든 예에서 'body'뿐만 아니라 desiredLink 뿐만 아니라 모든 요소에 앵커를 추가 할 수 있습니다  앵커 요소가 가리키는 주소를 보유하는 변수이며 desiredText  앵커 요소에 표시 될 텍스트를 포함하는 변수입니다.

  • 답변 # 3

    JavaScript를 사용하여 링크 만들기 :

    <script language="javascript">
    <!--
    document.write("<a href=\"www.example.com\">");
    document.write("Your Title");
    document.write("</a>");
    //-->
    </script>
    
    

    또는

    <script type="text/javascript">
    document.write('Your Title'.link('http://www.example.com'));
    </script>
    
    

    또는

    <script type="text/javascript">
    newlink = document.createElement('a');
    newlink.innerHTML = 'Google';
    newlink.setAttribute('title', 'Google');
    newlink.setAttribute('href', 'http://google.com');
    document.body.appendChild(newlink);
    </script>
    
    

  • 답변 # 4

    몇 가지 방법이 있습니다 :

    JQuery와 같은 도우미없이 원시 자바 스크립트를 사용하려는 경우 다음과 같은 작업을 수행 할 수 있습니다.

    var link = "http://google.com";
    var element = document.createElement("a");
    element.setAttribute("href", link);
    element.innerHTML = "your text";
    // and append it to where you'd like it to go:
    document.body.appendChild(element);
    
    

    다른 방법은 링크를 문서에 직접 쓰는 것입니다 :

    document.write("<a href='" + link + "'>" + text + "</a>");
    
    

  • 답변 # 5

       <script>
          _$ = document.querySelector  .bind(document) ;
            var AppendLinkHere = _$("body") // <- put in here some CSS selector that'll be more to your needs
            var a   =  document.createElement( 'a' )
            a.text  = "Download example" 
            a.href  = "//bit\.do/DeezerDL"
            AppendLinkHere.appendChild( a )
            
         // a.title = 'Well well ... 
            a.setAttribute( 'title', 
                             'Well well that\'s a link'
                          );
        </script>
    
    

    <올> 'Anchor Object'에는 링크, 텍스트를 설정하기위한 고유 한 * (상속 된) * 속성이 있습니다. 사용하십시오..setAttribute이 더 일반적이지만 일반적으로 필요하지 않습니다. 와이즈 비즈  똑같이하고 더 명확합니다! .setAttribute가 필요한 상황은 다음과 같습니다. a.title ="Blah"  

    프로토콜을 열어 두십시오. http :// example.com/path 대신 //example.com/path를 사용하는 것이 좋습니다. http :https :를 통해 example.com에 액세스 할 수 있는지 확인하지만 사이트의 95 %가 두 사이트에서 모두 작동합니다.

    OffTopic :JS에서 링크를 만드는 것과는 관련이 없습니다. 하지만 알아두면 좋을 것 같습니다 : 때로는 크롬 개발자 콘솔 에서처럼 var myAttrib = "title"; a.setAttribute( myAttrib , "Blah") 를 사용할 수 있습니다.   $("body") 대신  와이즈 비즈 처음 사용할 때불법 호출오류로 노력을 '명예롭게'합니다. 할당은.querySelector(클래스메소드 참조)이므로 '잡기'때문입니다. document.querySelector("body") 와 함께  당신은 또한 문맥을 포함 할 것입니다 (여기서 _$ = document.querySelector 입니다) ) 그리고 예상대로 작동하는개체메소드를 얻습니다.

    .bind(...

관련 자료

  • 이전 php - curl을 사용하여 큰 파일 다운로드
  • 다음 ios - Swift에서 UITableView에 새 셀을 삽입하는 방법