JavaScript では、要素の removeAttribute() メソッドを使用して、指定された属性を削除します。使用方法は次のとおりです。 パラメータ名は要素の属性名を示します。 例1次の例は、テーブルの境界線を動的に設定する方法を示しています。 <スクリプト> window.onload = function () { //ページが読み込まれたときにイベント ハンドラー関数をバインドします var table = document.getElementByTagName("table")[0]; //テーブル フレームへの参照を取得します var del = document.getElementById("del"); var リセット = document.getElementById("リセット"); del.onclick = 関数(){ テーブルに境界線属性を追加します。 } reset.onclick = 関数(){ テーブルに属性を設定します("境界線", "2"); } </スクリプト> <テーブルの幅="100%" 境界線="2"> <tr> <td>データテーブル</td> <tr> </テーブル> <button id="del">削除</button><button id="reset">復元</button> 上記の例では、2 つのボタンが設計され、異なるイベント処理関数にバインドされています。 「削除」ボタンをクリックすると、テーブルの removeAttribute() メソッドが呼び出され、テーブルの境界線がクリアされます。また、「復元」ボタンをクリックすると、テーブルの setAttribute() メソッドが呼び出され、テーブルの厚さがリセットされます。 例2次の例は、クラス削除関数をカスタマイズし、関数を呼び出して指定されたクラス名を削除する方法を示しています。 <スクリプト> function hasClass (element, className) { //クラス名検出関数 var reg = new RegExp ('(\\s|^)' + className + '(\\s|$)'); return reg.test (element, className); // 正規表現を使用して同じスタイルがあるかどうかを確認します} 関数deleteClass(要素、クラス名){ if (hasClass (要素、クラス名)) { element.className.replace (reg, ' '); //削除するスタイルをキャプチャし、空の文字列に置き換えます} } </スクリプト> <div id="red" class="red blue bold">ボックス</div> <スクリプト> var 赤 = document.getElementById("赤"); クラスを削除します (赤、'青'); </スクリプト> 上記のコードでは、正規表現を使用して、className 属性値の文字列に指定されたクラス名が含まれているかどうかを検出します。存在する場合は、一致した部分文字列が空の文字列に置き換えられ、クラス名を削除するという目的が達成されます。 removeAttribute メソッドと removeAttributeNode メソッドの相違点と類似点属性を削除する 指定された名前の属性をノードから削除します。以下は例です document.getElementById('riskTypePie').removeAttribute("スタイル"); 属性ノードの削除 方向:
var ノード = document.getElementById('chartWrap'); var attr=n.getAttributeNode('style'); ノードから属性を削除します。 類似点と相違点 類似点
違い
要素の特定の属性を削除する JS removeAttribute() メソッドに関するこの記事はこれで終わりです。要素の属性を削除する JS removeAttribute() の詳細については、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 以下もご興味があるかもしれません:
|
<<: ES6 における Object.assign() の使い方の詳細な説明
>>: JS addEventListener() およびattachEvent() メソッドは登録イベントを実装します
この記事の例では、検証コードを実装するためのjsの具体的なコードを参考までに共有しています。具体的な...
実験環境は以下のとおりですここでは、4 台のサーバー (1 台の nginx、負荷用の 2 台の t...
概要: MySQL は、トランザクションをサポートするためにさまざまなストレージ エンジンを提供しま...
基本的な構文CREATE VIEW ステートメントを使用してビューを作成できます。構文の形式は次のと...
序文この記事では、MySQL 8.0 の新機能を使用して再帰クエリを実装します。詳細なサンプル コー...
1. レイヤー4負荷分散の概要レイヤー 4 ロード バランシングとは何ですか?いわゆる 4 層負荷分...
あいまいクエリにOracleデータベースを使用する場合、コンソール エラーは次の図に表示されます。理...
目次tinymce、tinymce ts、tinymce-vue 宣言ファイルをインストールするパッ...
時々、選択した内容をグループ化する必要があります。以前はプログラム制御を使用していました。今日、se...
MySQLに何がインストールされているか確認する rpm -qa | grep -i mysql n...
この記事では、チャット機能を簡単に実装するためのVue+Websocketの具体的なコードを参考まで...
#docker 検索#docker プルポーター1. イメージを取得した後、中国語パッケージをダウン...
脆弱性の説明Apache Flink は、分散ストリームおよびバッチ データ処理用のオープン ソース...
フィルターを使用して画像に透明な CSS を書く方法コードをコピーコードは次のとおりです。 html...
背景開発やデバッグには Chrome Dev Tools がよく使用されますが、ページのパフォーマン...