cari

Rumah >hujung hadapan web >tutorial js >jQuery选择器[attribute^=value]的具体使用详解

jQuery选择器[attribute^=value]的具体使用详解

黄舟
黄舟asal
2017-06-23 13:31:211060semak imbas

返回值:Array9b16383a6b05c463860f147704984eb4[attribute^=value]

概述

匹配给定的属性是以某些值开始的元素

参数

attributeStringV1.0

属性名

value StringV1.0

属性值。引号在大多数情况下是可选的。但在遇到诸如属性值包含"]"时，用以避免冲突。

示例

描述:

查找所有 name 以 'news' 开始的 input 元素

HTML 代码:

<input name="newsletter" /> <input name="milkman" /> <input name="newsboy" />

jQuery 代码:

$("input[name^=&#39;news&#39;]")

结果:

[ <input name="newsletter" />, <input name="newsboy" /> ]

选择器能够选取属性值是以某些值开始的元素。

语法结构:

$("[attribute^=value]")

参数列表:

1577.png

实例代码:

实例一:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title></title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript"> 
$(document).ready(function(){ 
  $("button").click(function(){ 
    $("li[id^=s]").css("color","blue"); 
  })
})
</script>
</head>
<body>
<ul>
  <li id="first">html专区</li>
  <li id="second" title="jquery">Jquery专区</li>
</ul>
<button>点击查看效果</button>
</body>
</html>

以上代码可以将li元素中id属性值以s开头的li元素的文本颜色设置为蓝色。

实例二:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.jb51.net/" />
<title></title>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript"> 
$(document).ready(function(){ 
  $("button").click(function(){ 
    $("li[id^=[s]").css("color","blue"); 
  }); 
}); 
</script>
</head>
<body>
<ul>
  <li id="first">html专区</li>
  <li id="[second" title="jquery">Jquery专区</li>
</ul>

<button>点击查看效果</button>
</body>
</html>

从以上代码可以看出如何代码中含有"["或者"]"的时候，必须要带有引号，否则会造成匹配错误。

Atas ialah kandungan terperinci jQuery选择器[attribute^=value]的具体使用详解. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：jQuery选择器[attribute!=value]的使用说明Artikel seterusnya：JQuery中使用[attribute^=value]选择器有哪些需要注意的

Artikel berkaitan

Lihat lagi