javascript - jQuery: Prevent child from inheriting the parent's attributes? -
with jquery: how prevent children (<span>) inheriting parents' (<p>) attributes? i've been working on , researching 2+ hours; nothing has worked.
problem section:
$("p").not("span").css("cursor", "pointer");
<p>...<span>...</span></p>
full code:
<script src="https://code.jquery.com/jquery-1.10.2.js"></script> <style>body {font-family:arial,san-serif;font-size:25pt;}</style> <body> <p>always shown | <span>show/hide</span></p> <p>always shown | <span>show/hide</span></p> </body> <script> //change pointer hand: $("p").not("span").css("cursor", "pointer"); //show & hide clicking on "always shown": function handler(event) { var target = $(event.target); if (target.is("p")) { target.children().toggle(); } } $("body").click(handler).find("span").hide(); </script>
why don't use css?
p{ cursor: pointer; } p span{ cursor: default; }
Comments
Post a Comment