본문 바로가기
Coding/JavaScript

[JavaScript] 텍스트를 입력 받아 해시태그를 추가하는 방법 !! (# 추가하기)

by 포스트it 2024. 5. 3.
728x90
반응형

 

[JavaScript] 텍스트를 입력 받아 해시태그를 추가하는 방법 !! (# 추가하기)

input창에 텍스트를 넣으면 자동으로 해시태그(#)를 붙여주는 함수 입니다 ㅎ

 

예제코드
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Auto-Hashtag Function Example</title>
<script>
function addHashtag() {
    const inputField = document.getElementById('inputField').value;
    const inputs = inputField.split(',');  // 입력 값을 쉼표로 분리

    // 각 값의 앞에 #을 추가
    const processedValues = inputs.map(input => {
        const value = input.trim(); // 공백 제거
        return '#' + value; // 해시태그 추가
    });

    // 결과를 화면에 출력
    document.getElementById('result').textContent = processedValues.join(', ');
}
</script>
</head>
<body>
<h1>Automatic Hashtag</h1>
  <label for="inputField">값을 넣어주세요:</label>
  <input type="text" id="inputField" placeholder="단어는 콤마로 구분해주세요">
  <button onclick="addHashtag()">Click</button>
  <p id="result"></p>
</body>
</html>

결과값

Automatic Hashtag

728x90
반응형

댓글