입력 상자에 내용을 입력하면 해당 div에 세 가지 메서드 인스턴스가 나타납니다.
- 零下一度원래의
- 2017-05-09 10:08:262881검색
이 글에서는 주로 아래 p에 표시되는 입력 상자에 콘텐츠를 입력하는 다양한 방법을 소개합니다. js 메소드 jQuery 메소드; 🎜> 방법은 좋은 참고 가치를 가지고 있습니다. 아래 편집기로 살펴보겠습니다.
질문 예시: 입력 상자에 내용을 입력하면 아래 p에 다양한 방법이 표시됩니다.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<link rel="stylesheet" type="text/css" href="css/bootstrap.css" rel="external nofollow" />
<style type="text/css">
#p{
width: 175px;
height: 100px;
margin: 20px 84px;
border:2px solid green;
}
</style>
</head>
<body>
<p class="container">
请输入内容：<input type="text" id="put" />
<p id="p" ></p>
</p>
</body>
<script src="js/jquery-3.1.1.js"></script>
<script src="js/bootstrap.js"></script>
js: 기본DOM 작업<script type="text/javascript">
var put1=document.getElementById("put");
var p1=document.getElementById("p");
put1.onkeyup=function(){
p1.innerText=put1.value;
}
</script>
안내 미로: getElementById는
DOM 노드를 가져옵니다. innerHTML: 노드 내부의 모든 HTML 코드를 설정하거나 가져옵니다. 여기서 필요합니다. 입력에서 노드를 가져오는 데 주의하세요. 콘텐츠는 값을 가져와야 합니다.
여기서 사용되는 것은 내부
HTML 속성JQ 작업의 메서드와 구별되도록 주의하세요. <script src="js/angular.js"></script>
<script type="text/javascript">
$("#put").keyup(function(){
$("#p").html($("#put").val())
});
</script>
가이드: jQuery("selector").
action(); 선택기를 통해 이벤트 함수 를 호출하지만 JQuery에서는 JQuery를 $, 즉 $("selector").action(); >>Select 선택기는 CSS 선택기
를 직접 사용하여 AngularJs 연산:<body ng-app="">
<p class="container">
请输入内容：<input type="text" ng-model="name"/>
<p ng-bind="name"></p>
<!--<p id="p" >{{name}}</p>-->
</p>
</body>
1.ng-app: ng-app=""는 Angular의 관할 범위를 선언하며 일반적으로 본문에 작성됩니다. 원칙적으로 페이지는
2.ng-model만 있을 수 있습니다. 요소 값(명령어의 입력 필드 값)을 바인딩합니다. 애플리케이션 0a8bc3a1c393ad574b94550112e9f02936cc49f0c466276486e50c850b7e4956 변수
3.ng-bind: 지시어는 애플리케이션 변수 이름을 단락의 innerHTML에 바인딩합니다. 13aaf5bf552d43d11224df3448eff489 표현식
8be52d48d3dd0c5e3985460ca0e795e694b3e26ee717c64999d7867364b1b4a3을 바꿀 수 있습니다. 페이지가 로드되는 순간 {}가 표시됩니다.
[관련 권장사항]e388a4556c0f65e1904146cc1a846bee{{name}}94b3e26ee717c64999d7867364b1b4a3
무료 js 온라인 동영상 튜토리얼
3. php.cn Dugu Jiujian (3) - JavaScript 비디오 튜토리얼
위 내용은 입력 상자에 내용을 입력하면 해당 div에 세 가지 메서드 인스턴스가 나타납니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!