HTMLで入力した文章を逆に配置します。何の役にも立ちませんが・・・。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>文字列を逆にする</title>
<style>
body {
background: black;
color: white;
}
input[type="text"] {
width: 40%; /* 親要素の幅40%に広げる */
padding: 15px; /* 上下左右に余白を設けて大きくする */
font-size: 16px; /* 文字サイズも大きくするとさらに見やすい */
box-sizing: border-box; /* paddingを含めたサイズ計算にする */
}
</style>
</head>
<body>
<center>
<h3></h3>
<input type="text" id="textInput" placeholder="文章を入力">
<br><br>
<button onclick="reverseText()">逆にする</button>
<p id="result"></p>
<script>
function reverseText() {
const text = document.getElementById("textInput").value;
const reversed = text.split("").reverse().join("");
document.getElementById("result").textContent = reversed;
}
</script>
</center>
</body>
</html>
実行したら変換したいテキストを入力します。
大量文章もOKですが、input処理のため自動改行が出来ないので、コピー&ペーストが良いです。入力後に［逆にする］で結果が表示されます。
英文なども問題ありません。
