JqueryでHTML・CSSの編集でやってみた事忘れないようにを書いてみた①

～～～～～～HTMLの書き換え～～～～～～～
■javascriptソース
<javascript type="text/javascript">
   $(function(){
     $("a") .after("<p>test</p>");
});
</javascript>

■ｈｔｍｌソース
<a href="">文字</a>

■解説
①「after」。。。。Jqueryの「after」メソッドは指定したセレクタの要素の後にHTMLを追加します。
 ②「html」。。。。Jqueryの「ｈｔｍｌ」メソッドはセレクタで指定した要素の内側を操作する
 ③「append」。。。。Jqueryの「append」メソッドはセレクタで指定した要素の中の最後にHTMLを追加
④「wrap」。。。。Jqueryの「wrap」メソッドはセレクタで指定した要素を指定したHTMLタグで囲みます
⑤「replaceWith」。。。 Jqueryの「replaceWith」メソッドはセレクタで指定した要素を、メソッドの指定
した要素と置き換えます

＊その他いろいろとあるので調べてみようと思います。

---

～～～～～～HTMLの属性を書き換え～～～～～～～
①      $(function(){
          $("a").attr({
                "href":""
              });
          });
    </script>

■①解説
指定したセレクタの要素の属性や属性値を操作します。

---

②    <script type="text/javascript">
      $(function(){
          $("a").removeAttr("href");
          });
    </script>
■②の解説
指定したセレクタの要素の属性を削除します。

---

③  <script type="text/javascript">
      $(function(){
          $("a").addClass("class2");
          });
    </script>

■③の解説
指定したセレクタの要素Classの属性値を追加します
また、複数のclass属性値の追加は半角スペースで区切って追加します

---

④    <script type="text/javascript">
      $(function(){
          $("a").attr("class","class3");
          });
    </script>



■④の解説
指定したセレクタの要素の属性クラスの値を書き換えます。

---

   ⑤ <script type="text/javascript">
      $(function(){
          $("a").removeClass("class1");
          });
    </script>
■⑤ 指定したセレクタのクラス値を削除

---

⑥    <script type="text/javascript">
      $(function(){
          $("a").toggleClass("class1");
          });
    </script>
■⑥の解説
指定したセレクタのクラス値があれば削除、なければ追加

---

⑦    <script type="text/javascript">
      $(function(){
          $("a").val("");
          });
    </script>
■⑦調査中
JqueryでHTML・CSSの編集でやってみた事忘れないようにを書いてみた②に続きます