jQuery 元素选择器用法简介

2021年3月10日15:51:49 发表评论 811 次浏览

jQuery元素选择器用于根据元素名称选择和修改HTML元素。

语法如下:

$("element_name")

示例1:本示例选择" h2"元素并为其添加边框。

<!DOCTYPE html>
< html >
  
< head >
  
     < script src =
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" >
   </ script >
  
     
   < script >
     $(document).ready(function() {
      $("h2").css("border", "5px solid green");
         });
     </ script >
  
</ head >
  
< body >
  
     < h2 >lsbin
   </ h2 >
  
</ body >
  
</ html >

输出如下:

jQuery |元素选择器1

示例2:本示例在单击按钮时更改" h2"元素的文本颜色。

<!DOCTYPE html>
< html >
  
< head >
  
     < script src =
"https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js" >
   </ script >
  
     < script >
         $(document).ready(function() {
          $("button").click(function() {
             $("h2").css("color", "green");
             });
         });
     </ script >
  
</ head >
  
< body >
  
     < h2 >lsbin</ h2 >
  
     < button >Change text color
   </ button >
  
</ body >
  
</ html >

之前:

jQuery |元素选择器2

后:

jQuery |元素选择器3

木子山

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: