본문 및 댓글 a태그 타겟 바꾸기 및 링크 삭제 > 질문답변

도라지 본문 및 댓글 a태그 타겟 바꾸기 및 링크 삭제

페이지 정보

작성자 들레아빠쪽지보내기 메일보내기 홈페이지 자기소개 아이디로 검색 전체게시물
댓글 0건 조회 92회 작성일 25-06-22 17:52

본문

간혹 심심찮게 올라오는 질문이 게시판의 본문이나 댓글에서 a태그의 타겟을 바꾸거나

a태그의 문자만 취하고 링크 부분을 삭제하는 것을 물어오는 분들이 꽤 되어서 정리해 봅니다.

프론트에서 바닐라 자바스크립트로 코드를 짜 보았습니다.

소스는 view.skin.php 또는 view_comment.skin.php 두 문서 중 문서의 위치에 상관없이 문서의 아무 곳에나 입력해도 괜찮습니다.

----------

1. 본문

1) 본문의 모든 링크를 현재창으로 열기

<script>
document.addEventListener("DOMContentLoaded", function() {
    for (mainA of bo_v_con.getElementsByTagName("a")) mainA.target = "_self";
} );
</script>

-----------

2) 본문의 모든 링크를 새창으로 열기

<script>
document.addEventListener("DOMContentLoaded", function() {
    for (mainA of bo_v_con.getElementsByTagName("a")) mainA.target = "_blank";
} );
</script>

----------

3) 본문의 모든 링크를 삭제하고 문자만 남기기

<script>
document.addEventListener("DOMContentLoaded", function() {
    bo_v_con.innerHTML = bo_v_con.innerHTML.replace(/<(\/a|a)([^>]*)>/gi, "");
} );
</script>

----------

2. 댓글

1) 댓글의 모든 링크를 현재창으로 열기

<script>
document.addEventListener("DOMContentLoaded", function() {
    for (commentA of bo_vc.getElementsByTagName("a")) commentA.target = "_self";
} );
</script>

-----------

2) 댓글의 모든 링크를 새창으로 열기

<script>
document.addEventListener("DOMContentLoaded", function() {
    for (commentA of bo_vc.getElementsByTagName("a")) commentA.target = "_blank";
} );
</script>

----------

3) 댓글의 모든 링크를 삭제하고 문자만 남기기

<script>
document.addEventListener("DOMContentLoaded", function() {
    for (commentA of bo_vc.getElementsByClassName("cmt_contents")) commentA.innerHTML = commentA.innerHTML.replace(/<(\/a|a)([^>]*)>/gi, "");
} );
</script>

----------

3. 본문과 댓글을 같이 쓸 경우에는 코드를 따로 분리하지 말고 아래처럼 사용하세요.

document.addEventListener("DOMContentLoaded", function() {
    bo_v_con.innerHTML = bo_v_con.innerHTML.replace(/<(\/a|a)([^>]*)>/gi, "");
    for (commentA of bo_vc.getElementsByTagName("a")) commentA.target = "_blank";
} );

----------

그누순정 기준입니다. 빌더나 테마는 적용되지 않을 수도 있습니다.^^

----------

댓글에서 호텔천사님이 말한 게시글 중 특정 단어 전부에 임의로 링크를 거는 함수를 만들어 보았습니다.

2022년 3월 21일 삼성 모바일 브라우저에서 안 먹히는 부분을 수정하였습니다.

----------

1. 본문

<script>
function aMain() {
    bo_v_con.innerHTML = bo_v_con.innerHTML.replace(new RegExp(arguments[0], "gi"), "<a href=" + arguments[1] + " target=" + arguments[2] + ">" + arguments[0] + "</a>");
}
document.addEventListener("DOMContentLoaded", function() {
    aMain("호텔천사", "https://url.kr/", "_blank");
    aMain("sinbi", "https://homzzang.com/", "_self");
} );
</script>

aMain("단어", "경로", "타겟"); 이런 형태로 몇개를 넣어도 상관이 없습니다.

아래 댓글의 경우는 함수명만 다르고

aComment("단어", "경로", "타겟"); 이렇게 유사한 패턴으로 사용하세요.

----------

2. 댓글

<script>
function aComment() {
    for (commentA of bo_vc.getElementsByClassName("cmt_contents")) commentA.innerHTML = commentA.innerHTML.replace(new RegExp(arguments[0], "gi"), "<a href=" + arguments[1] + " target=" + arguments[2] + ">" + arguments[0] + "</a>")
}
document.addEventListener("DOMContentLoaded", function() {
    aComment("호텔천사", "https://url.kr/", "_blank");
    aComment("sinbi", "https://homzzang.com/", "_self");
} );
</script>

----------

특정단어의 링크 치환은 모든 링크를 핸들링 한 다음에 마지막 코드로 넣어주어야 합니다.

만일 특정게시글에만 적용을 하고 싶으면 여분필드를 하나 만들고...

그 여분필드에 yes 를 입력한 게시글만 적용되게끔 php에서 이프문으로 감아버리면 되겠습니다.

역시 동일한 원리이지만 체크박스나 라디오버튼으로도 충분히 가능하겠지요.

<?php if (여분필드 == "yes") { ?>

자바스크립트 코드

<?php } ?>

이전글https://openweathermap.org에서 제공하는 날씨 상태에 해당하는 배경 이미지를 모두 골라 줄 수 있나요? 25.06.30
다음글Hello? I hope you have a great weekend. 25.06.18

질문답변

도라지 본문 및 댓글 a태그 타겟 바꾸기 및 링크 삭제

페이지 정보

본문

회원로그인

사이트 정보

공지사항

접속자집계