How to get element with tag name having specific attribute in jquery or angularjs

Question

I have a div having many tags inside. I want to bind the click event on all text elements that have x attribute.

I have tried

$('#attendacneLineChart').find('text')

but this returns all the text elements. But I need only those text element that has x attribute.

It's not a duplicate. I mean clearly OP can select by attribute using jQuery, but they should never do this in angular. Instead this should be done with a directive. — dfsq, Jul 12 '16 at 09:58
There is no such thing as a 'text element,' can you please give an example of the HTML you're trying to describe? And what attribute are you looking for? What do you want to do on the 'click' event? — David Thomas, Jul 12 '16 at 09:59
It is marked jQuery. Duplicate of this then? http://stackoverflow.com/questions/11913841/accessing-attributes-from-an-angularjs-directive - I closed it and then I saw the "text with attribute" which does not make sense anyway. OP needs to show examples of html with or without the attribute he meant — mplungjan, Jul 12 '16 at 10:00

Mohamed-Yousef · Accepted Answer · 2016-07-12T10:01:30.763

2

use

$('#attendacneLineChart').find('text[X]')

if you want to ignore some elements with specific attr you can use :not

$('#attendacneLineChart').find('text[X]:not([y])') // for more use 'text[X]:not([y]):not([z])'

edited Jul 12 '16 at 10:01

answered Jul 12 '16 at 09:56

Mohamed-Yousef

23,946
3
19
28

1

No, this is totally wrong. Remember, we are talking able Agnular, not jQuery. – dfsq Jul 12 '16 at 09:59
thanks ! this is working.. If I want to ignore some elements with specific attribute ? – Sunil Garg Jul 12 '16 at 09:59

score 2 · Answer 2 · answered Jul 12 '16 at 09:57

I want to bind the click event on all text elements that have x attribute.

Create directive for this:

.directive('x', function() {
  return {
    link: function(scope, element) {
      element.click(function() {
        console.log('clicked')
      })
    }
  }
})

score 0 · Answer 3 · answered Jul 12 '16 at 10:01

You can use jquery [attribute='value'] selector to finding element has specific attribute.

$("div > p[myAttr]").click(function(){
    console.log($(this).text());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
    <p>Text1</p>
    <p myAttr="1">Text2</p>
    <p>Text3</p>
    <p myAttr>Text4</p>
</div>

How to get element with tag name having specific attribute in jquery or angularjs

3 Answers3