如何获取我的data-lp属性 <li> 标签？

Question

I need to get the data-lp and the class value using javascript?

the logic i want is this:

if (document.querySelector('li[data-lp="9"].disabled'))
        {
            $('li[data-lp="9"].disabled').append('<style>div{border: 1px solid red;}</style>');
        }
        else
        {
            remove the style i made above.
        }

I want to put an under in this condition. Is that possible?

Answer 1

This will be a complex selector, so you will need to use querySelector ^MDN .

 var lp9 = document.querySelector('li[data-lp="9"].disabled'); lp9.style.color = "red"; 

 <div> <ul> <li>1</li> <li data-lp="4" class="none">2</li> <li data-lp="9" class="disabled">3</li> </div> 

If you are using jQuery as your now edited question suggests, just do the entire thing in jQuery.

 var $lp9 = $('li[data-lp="9"]'); if($lp9.is('.disabled')){ $lp9.append('<style>.div{border: 1px solid red;}</style>'); }else{ $lp9.empty(); } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div> <ul> <li>1</li> <li data-lp="4" class="none">2</li> <li data-lp="9" class="disabled">3</li> </ul> </div> <div class="div">Other Content</div>