ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScriptをクリックして拡張子を削除し、ファイル名を取得する方法
前回の記事「JavaScriptで連想配列のキーを取得する2つの方法」では、JavaScriptで連想配列のキーを取得する方法を紹介しましたので、興味のある方はぜひ学んでみてください~
この記事の焦点は、クリックして拡張子を削除し、JavaScript を通じてファイル名を取得する方法を説明することです。
早速、本題に入りましょう。
2 つの実装方法を紹介します:
最初の方法のコードは次のとおりです:
注: この例は次のとおりです。 を使用します。 split()、slice()、および join() メソッドはファイル名を取得します。
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body style = "text-align:center;">
<h1 style = "color:#ff311f;" >
PHP中文网
</h1>
<p id = "GFG_UP" style =
"font-size: 15px; font-weight: bold;">
</p>
<button onclick = "gfg_Run()">
点击
</button>
<p id = "GFG_DOWN" style =
"color:#ff311f; font-size: 20px; font-weight: bold;">
</p>
<script>
var el_up = document.getElementById("GFG_UP");
var el_down = document.getElementById("GFG_DOWN");
var fName = "fileName.jpg";
el_up.innerHTML = "String = '"+fName + "'";
function gfg_Run() {
el_down.innerHTML = fName.split('.').slice(0, -1).join('.');
}
</script>
</body>
</html>効果は次のとおりです:
split() メソッド: 文字列を文字列に分割するために使用されます。配列。
slice() メソッド: 文字列の特定の部分を抽出し、抽出した部分を新しい文字列として返します。
join() メソッド: 配列内のすべての要素を文字列に入れるために使用されます。
2 番目のメソッド コードは次のとおりです:
注: この例では RegExp と ## を使用します。 # replace() メソッドはファイル名を取得します。
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body style = "text-align:center;">
<h1 style = "color:#17c4ff;" >
PHP中文网
</h1>
<p id = "GFG_UP" style =
"font-size: 15px; font-weight: bold;">
</p>
<button onclick = "gfg_Run()">
点击
</button>
<p id = "GFG_DOWN" style =
"color:#17c4ff; font-size: 20px; font-weight: bold;">
</p>
<script>
var el_up = document.getElementById("GFG_UP");
var el_down = document.getElementById("GFG_DOWN");
var fName = "fileName.jpg";
el_up.innerHTML = "String = '" + fName + "'";
function gfg_Run() {
el_down.innerHTML =fName.replace(/\.[^/.]+$/, "")
}
</script>
</body>
</html>効果は次のとおりです。
JavaScript Basics Tutorial」をお勧めします ～皆さんもぜひ学んでください～
以上がJavaScriptをクリックして拡張子を削除し、ファイル名を取得する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。