ホームページ > 記事 > ウェブフロントエンド > jqueryのvalueメソッドとは何ですか?
jqueryのvalueメソッドとは何ですか?
- 青灯夜游オリジナル
- 2022-05-17 14:15:553289ブラウズ
値を取得する 5 つの方法: 1. "element object.text()" を使用して、指定された要素のテキスト コンテンツを取得します。 2. "element object.html()" を使用して、次の内容を含むコンテンツを取得します。要素内のタグ; 3. "input box element.val()" を使用してユーザー入力コンテンツを取得します; 4. "element object.attr("属性名")" を使用して指定された属性の値を取得します。 。
このチュートリアルの動作環境: Windows7 システム、jquery3.2.1 バージョン、Dell G3 コンピューター。
jqueryで値を取得する方法はたくさんありますが、以下で紹介していきます。
1. 要素のコンテンツ値を取得する 2 つのメソッド: text() または html()
text() メソッドは次のことができます。選択した要素のテキスト内容を返します。
html() メソッドは、選択した要素 (innerHTML) のコンテンツを返すことができます。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-3.2.1.min.js"></script>
<script>
$(document).ready(function() {
$("button").click(function() {
console.log($("p").text());
console.log($("p").html());
});
});
</script>
</head>
<body>
<button>获取p元素的内容</button>
<p>这是一个<b>段落</b>。</p>
</body>
</html>
# 2. 入力ボックスの入力値を取得します。
入力ボックスの入力値は、value 属性で制御されます。 val() メソッドを使用して直接取得することも、attr("value") メソッドを使用して取得することもできます。<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-3.2.1.min.js"></script>
<script>
$(document).ready(function() {
$("button").click(function() {
console.log($("input[type=text]").val());
console.log($("input[type=password]").attr("value"));
});
});
</script>
</head>
<body>
<button>获取input元素的内容</button>
<p>用户名: <input type="text" name="user" value="李华" /></p>
<p>密 码: <input type="password" name="password" value="123456" /></p>
</body>
</html>
3. 要素の属性値の取得
要素の属性値は 2 つの方法で取得できます:- attr() メソッド
- prop() メソッド
例 1: attr() を使用して共通属性の値を取得する
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-3.2.1.min.js"></script>
<script>
$(document).ready(function() {
$("button").click(function() {
console.log($("input").attr("name"));
});
});
</script>
</head>
<body>
<button>获取name属性值</button>
<p>用户名: <input type="text" name="user" value="李华" /></p>
</body>
</html>
例 2: を使用します。 prop() ブール属性の値を取得します
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/jquery-3.2.1.min.js"></script>
<script>
$(document).ready(function() {
$("button").click(function() {
console.log($("input").prop("disabled"));
});
});
</script>
</head>
<body>
<button>获取disabled属性值</button>
<p>密 码: <input type="password" name="password" value="123456" disabled /></p>
</body>
</html>
jQuery ビデオ チュートリアル 、Web フロントエンドビデオ＃＃＃]＃＃ ＃
以上がjqueryのvalueメソッドとは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。