ホームページ > ウェブフロントエンド > jsチュートリアル > ボタンをクリックしてテキストコンテンツを取得し、style_javascript スキルを変更するための JS 実装

ボタンをクリックしてテキストコンテンツを取得し、style_javascript スキルを変更するための JS 実装

WBOY
リリース: 2016-05-16 16:36:53
オリジナル
1818 人が閲覧しました

要件: ボタンをクリックして入力ボックスで選択したコンテンツを取得し、選択したコンテンツを赤色にします。

実装: コードは次のとおりです

<!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>
ログイン後にコピー

効果:

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート