开发者

"#orderedlist > li" selector

开发者 https://www.devze.com 2022-12-14 08:56 出处:网络
I\'m studying jQuery with this tutorial, but one of examples doesn\'t work. <html> <head> <style type=\"text/css\">

I'm studying jQuery with this tutorial, but one of examples doesn't work.

<html>
  <head>
    <style type="text/css">
      a.test { font-weight: bold; background: #fc0 }
    </style>
    <script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">
      $(doc开发者_开发百科ument).ready(function(){
        $("#ol > li").addClass("test");
        $("#some").addClass("test");
      });
    </script>
    </head>
   <body>
     <a href="http://jquery.com/" id="some">Some</a>
     <ul id="ol">
      <li>one</li>
      <li>two</li>
      <li>three</li>
    </ul>
  </body>
</html>

This example apply the "test" style to hyperlink (#some), but doesn't apply this style to the ordered list (#ol). Why?


remove the a from

a.test { font-weight: bold; background: #fc0 }

The a limits it to links (anchor tags).


The JavaScript is OK, the CSS isn't. The CSS rule only applies to links.

To see the effect, change the CSS to:

.test { font-weight: bold; background: #fc0 }
0

精彩评论

暂无评论...
验证码 换一张
取 消