Community

Learn

Tools Library

AI Tools

Leisure

English

Home > Web Front-end > JS Tutorial > js implementation of clicking the button to get the text content and change the style_javascript skills

js implementation of clicking the button to get the text content and change the style_javascript skills

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

Release： 2016-05-16 16:36:53

Original

1868 people have browsed it

Requirement: Click the button to get the selected content in the input box and make the selected content turn red,

Implementation: The code is as follows

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="content-type" content="text/html;charset=utf-8">

<title>Test</title>

<style type="text/css">

div{

display: none;

}

</style>

</head>

<body>

<input type="text" id="txt" value="" /> 

<input type="button" value="获取文本框内的值" id="btn" onclick="getText();"/>

<div id="showText">

</div>

<script type="text/javascript">

function getText () {

var showText = document.getElementById("showText");

showText.style.display = "block";

showText.style.color = "red";

showText.innerHTML=document.getElementById("txt").value;

}

</script>

</body>

</html>

Copy after login

Effect:

Related labels：

change style

Previous article：JavaScript and jquey realize the merging operation of multiple arrays_javascript skills Next article：jquery uses the offset() method to obtain the xy coordinates of the element_jquery

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn