查找特定属性并获取其值答案

【问题标题】：Find specific attribute and get its value查找特定属性并获取其值
【发布时间】：2017-11-13 06:38:45
【问题描述】：

我有这个：

<button>Click</button>
<p class="intro" voice="next,1">My name is Donald.</p>

并且需要找到“voice”属性并获取其值“next” 我通过查看所有问题进行了尝试，但它显示未定义。

$(document).ready(function(){
    $("button").click(function() {
    var ab = $(document).find("[voice=' ']")[0];
    console.log(ab);
    });
});

【问题讨论】：

如果我写 var ab = $("p").attr("voice")[0];所以不用担心验证。
你可以使用$(document).find(".intro").attr("voice")
不能使用任何其他标签

标签： jquery find attr

【解决方案1】：

您可以使用[voice] 选择器来选择您的元素，并使用attr() 方法来获取属性值。之后使用split() 方法来获取您的价值。喜欢以下。

 $("button").click(function() {
    var ab = $("[voice]"),
        text = ab.attr('voice').split(',')[0];
    console.log(text);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>Click</button>
<p class="intro" voice="next,1">My name is Donald.</p>

【讨论】：

只需要“下一个”值，在我执行此操作时以您的示例为例 console.log(ab.attr('voice')[0]);它只给我“n”
是我的错，我没有应用 split()
如果我有多个语音标签，我应该怎么做：voice="next,1" voice="play,1" voice="previous,1" mu 当前代码只搜索第一个语音标签。
你应该使用each。见jsfiddle.net/exc88sad@naveendharni

【解决方案2】：

这样试试

$(document).ready(function(){
    $("button").on('click', function() {
    var ab = $(document).find("[voice]").attr('voice');
    console.log(ab);
    });
});

如果你想在这里玩https://jsfiddle.net/up9ub1uh/

最好使用data-voice 而不是voice 属性。

【讨论】：

【解决方案3】：

试试这个。

$(document).ready(function(){
    $("button").click(function() {
    var ab = $("p").attr('voice');
    console.log(ab);
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>Click</button>
<p class="intro" voice="next,1">My name is Donald.</p>

【讨论】：

【解决方案4】：

试试这段代码

$(document).ready(function() {
  $("button").click(function() {
    var ab = $(".intro").attr('voice');
    var new1 = ab.split(",");
    console.log(new1[0]);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button>Click</button>
<p class="intro" voice="next,1">My name is Donald.</p>

【讨论】：

【解决方案5】：

您不需要使用 .find，正如您在此示例中看到的那样：

<p>Once there was a <em title="huge, gigantic">large</em> dinosaur...</p
 <script>
 var title = $( "em" ).attr( "title" );
 console.log(title);
 </script>

你应该只这样做：

<p class="intro" voice="next,1">My name is Donald.</p>
 <script>
 var title = $( "p" ).attr( "voice" );
 console.log(title);
  </script>

【讨论】：