미니프로젝트 #2 글자 수 계산기
document.getElementById(‘Id’)
특정 ID를 가진 태그 선택
document.getElementById(‘Id’).value
태그 안의 값
document.getElementById(‘Id’).innerHTML
태그 안의 값
.substring(a,b)
인덱스 a이상 b미만의 문자열만 표시
<body class='container'>
<h1>자기소개</h1>
<textarea class="form-control" rows="3" id="project" onkeydown="counter();">내용을 입력하세요.</textarea>
<span id="count">(0/200)</span>
<script>
function counter() {
var content = document.getElementById('project').value;
if (content.length > 200) {
content = content.substring(0,200);
document.getElementById('project').value = content;
}
document.getElementById('count').innerHTML = '(' + content.length + '/200)';
}
counter();
</script>
</body>
'HTML, CSS , JavaScript' 카테고리의 다른 글
[JavaScript] jQuery (미니 게임) (0) | 2023.02.21 |
---|---|
[JavaScript] 기념일 디데이 계산기 (0) | 2023.02.21 |
[JavaScript] 로또 번호 추첨 (0) | 2023.02.21 |
[JavaScript] 배열과 객체 (0) | 2023.02.21 |
[JavaScript] 변수, 출력, 조건문, 반복문 (0) | 2023.02.21 |