제목을위한 문자열과 링크를위한 문자열이 있습니다. Javascript를 사용하여 페이지에 링크를 만들기 위해 두 가지를 함께 묶는 방법을 모르겠습니다. 도움을 주시면 감사하겠습니다.
EDIT1 : 질문에 더 자세한 내용 추가. 내가 이것을 알아 내려고하는 이유는 RSS 피드가 있고 제목과 URL 목록이 있기 때문입니다. 페이지를 유용하게 만들기 위해 제목을 URL에 연결하고 싶습니다.
EDIT2 : jQuery를 사용하고 있지만 완전히 새로워 서이 상황에서 도움이 될 수 있다는 것을 몰랐습니다.
- 답변 # 1
- 답변 # 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);
JQuery 사용 <올><script type="text/javascript"> //note that this case can be used only inside the "body" element document.write('<a href="'+desiredLink+'">'+desiredText+'</a>'); </script>
$('<a href="'+desiredLink+'">'+desiredText+'</a>').appendTo($('body'));
$('body').append($('<a href="'+desiredLink+'">'+desiredText+'</a>'));
위의 모든 예에서 'body'뿐만 아니라var a = $('<a />'); a.attr('href',desiredLink); a.text(desiredText); $('body').append(a);
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
<올> 'Anchor Object'에는 링크, 텍스트를 설정하기위한 고유 한 * (상속 된) * 속성이 있습니다. 사용하십시오..setAttribute이 더 일반적이지만 일반적으로 필요하지 않습니다. 와이즈 비즈 똑같이하고 더 명확합니다! .setAttribute가 필요한 상황은 다음과 같습니다.<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>
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(...
관련 자료
- html 및 javascript를 사용하여 복사 버튼을 만드는 방법은 무엇입니까?
- html - Javascript를 사용하여 링크 가능한 제목을 어떻게 만들 수 있습니까?
- python - Pygame을 사용하여 버튼을 어떻게 동적으로 생성합니까?
- average - Excel Averageifs에 해당하는 것을 사용하여 파이썬 데이터 프레임에 새 열을 어떻게 생성합니까?
- html - JavaScript 'if eventtarget'에 클래스 이름 사용
- Javascript - 자바 스크립트 - 필터링 된 중첩 배열을 만드는 방법
- PHP를 사용하여 mysql 데이터베이스 데이터를 javascript 함수에 전달하는 방법은 무엇입니까?
- numpy의`full ()`메서드와 파이썬 목록을 사용하여 numpy 배열을 만들 수 없습니다
- javascript - 작업자 로더를 사용하여 웹 워커와 함께 typescript 라이브러리를 만드는 방법
- node.js - 공유 자바 스크립트 모듈에서 가져 오기 사용
- reactjs - 자바 스크립트를 사용하여 기존 배열로 데이터 푸시
- html - 자바 스크립트를 사용하여 루프에서 SVG 폴리 라인 그리기
- JavaScript to HTML (JSON)을 사용하여 배열과 연결된 루프
- jQuery 또는 JavaScript를 사용하여 배열에서 데이터 추출
- 아카이브 된 파일의 json에서 특정 값을 읽는 방법 javascript 및 jszip 사용
- r - 파이프 라인 내의 식별자 열을 사용하여 최대 값이있는 새 열 만들기
- function - 사용자 입력, JavaScript를 사용하여 타이머 설정
- javascript - Alpinejs를 사용하여 애니메이션 숫자 카운터를 만들려면 어떻게해야합니까?
- arrays - join을 사용하여 자바 스크립트에서 줄을 나누는 방법
- arrays - 자바 스크립트를 사용하여 레벨 및 이름 정보를 사용하는 트리 계층 구조
- javascript : 브라우저에서 페이지 로드 시 오디오 자동 재생
- javascript : jQuery 인라인을 어떻게 사용합니까?
- javascript : [복제] 클릭 시 버튼 색상 전환
- javascript : 버튼 클릭으로 커서를 변경하는 방법
- javascript : TypeError: data.forEach는 함수가 아닙니다.
- javascript : .click 토글 기능을 어떻게 재설정합니까?
- javascript : HTML 전화번호 유효성 검사
- javascript : jquery를 사용하여 카테고리에 따라 관련 없는 div를 페이드 아웃하는 메뉴
- javascript : html, css, js로 onclick 이벤트를 어떻게 할 수 있습니까?
- javascript : codepen.io 프로필 이미지 업로드 JQuery가 작동하지 않음