jQuery を使用して HTML 要素の属性を変更する方法

jQuery は、Web ページ上の HTML 要素のスタイルとコンテンツを動的に変更するために使用される人気のある JavaScript ライブラリです。この記事では、jQueryを使ってHTML要素の属性を変更する方法を紹介します。

ステップ 1: jQuery ライブラリを導入する

jQuery を使用する前に、そのライブラリ ファイルを Web ページに追加する必要があります。 jQuery ライブラリ ファイルを直接ダウンロードしてプロジェクト フォルダーに追加することも、CDN (コンテンツ配信ネットワーク) を使用して jQuery を参照することもできます。以下は、jQuery を導入するコード スニペットです:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

ステップ 2: 要素を選択し、属性を変更します

jQuery ライブラリ ファイルを導入したら、jQuery セレクターを使用して HTML 要素を選択し、それらの属性を変更します。

要素の CSS プロパティを変更する

css() メソッドを使用して、1 つ以上の CSS プロパティを変更します。たとえば、次のコードは、ID が「myDiv」の要素の背景色を赤に変更します。

$('#myDiv').css('background-color', 'red');

要素のテキスト コンテンツを変更します

By using the text( ) メソッドを使用すると、HTML 要素のテキストの内容を変更できます。たとえば、次のコードは p 要素のテキスト コンテンツを変更します。

$('p').text('这是新文本内容！');

要素の HTML コンテンツを変更する

## を使用して HTML 要素の HTML を変更できます。 #html() メソッドの内容。たとえば、次のコードは、ID が「myDiv」の要素の HTML コンテンツを変更します。

$('#myDiv').html('<h1>这是新的HTML内容</h1>');

attr() メソッドを使用すると、HTML 要素の属性を変更できます。たとえば、次のコードは img 要素の src 属性を変更します。

$('img').attr('src', 'newImage.jpg');

以上がjQuery を使用して HTML 要素の属性を変更する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。