jquery按名称选择_jQuery按名称选择

最新推荐文章于 2021-09-26 18:00:42 发布

cunchi4221

最新推荐文章于 2021-09-26 18:00:42 发布

阅读量856

点赞数

文章标签： css html js jquery javascript ViewUI

原文链接：https://www.journaldev.com/4552/jquery-select-name

版权

jquery按名称选择

jQuery select by name or jQuery element selector allows us to find all HTML elements with the given tag name. You can do any sort of manipulation like animating or any other special effects after selecting the element and that change will take effect in all the elements of the same type or tag name. Earlier we learned using jQuery select by id and jQuery select by class.

jQuery按名称选择或jQuery元素选择器允许我们查找具有给定标签名称的所有HTML元素。选择元素后，您可以进行任何类型的操作，例如动画设置或任何其他特殊效果，并且更改将在相同类型或标记名称的所有元素中生效。之前我们学习过使用jQuery按id 选择和按类选择jQuery 。

jQuery按名称选择 (jQuery select by Name)

Here is the general syntax for using the jQuery select by name:

以下是使用jQuery按名称选择的一般语法：

$('tagName')

Any standard HTML elements like div, li, img, p, em etc could be used as the tagName. For example;

任何标准HTML元素（例如div，li，img，p，em等）都可以用作tagName 。例如;

$('div') : This element selector will select all the div elements in the document.

$('div') ：此元素选择器将选择文档中的所有div元素。

$('p') : This jquery select by name will consider all the paragraph elements in the document.

$('p') ：按名称选择的此jquery将考虑文档中的所有段落元素。

If there are multiple <div> elements, you can change all the <div> elements in the document with this single expression $(‘div’).

如果有多个<div>元素，则可以使用单个表达式$（'div'）更改文档中的所有<div>元素。

You can hide, show or do any kind of manipulations on that <div> element. This is the most powerful advantage of using this jQuery selector.

您可以在该<div>元素上隐藏，显示或进行任何类型的操作。这是使用此jQuery选择器的最大优势。

jQuery按名称选择示例 (jQuery select by Name Example)

This example demonstrates the use of jQuery select by name of tag, we will change the CSS style of the selected element.

此示例演示了使用jQuery通过标签名称进行选择，我们将更改所选元素CSS样式。

<html>
<head>
  <title>jQuery selector By Name</title>
  <style>
  div, span {
    width: 70px;
    height: 70px;
    float: left;
    padding: 12px;
    margin: 12px;
    background-color: #eee;
  }
  </style>
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<div>DIV 1</div>
<span>SPAN 1 </span>
<div>DIV 2</div>
<span>SPAN 2 </span>
 
<script>
$( "div" ).css( "border", "5px solid green" );
</script>
</body>
</html>

In this example, you can see the selector $("div") is selected to change the CSS style. The only change in the code modified all the div elements uniformly. This is the strength of jQuery selector by name.

在此示例中，您可以看到选择器$("div")被选中以更改CSS样式。代码中的唯一更改是统一修改了所有div元素。这就是jQuery选择器的强项。

Below image shows the output produced by above HTML page.

下图显示了以上HTML页面产生的输出。

Therefore, in the case of enforcing a uniform behavior on html elements, you can use jQuery select by name in the code.

因此，在对html元素强制执行统一行为的情况下，可以在代码中使用jQuery按名称选择。