开发者

Wordpress / jQuery - Automatically detecting first paragraph tag

开发者 https://www.devze.com 2023-03-03 22:51 出处:网络
Im using wordpress to develop a site ... I want to display everything in the first < p > < /p > tag and then wrap the rest of the content in a div, is this possible using jQuery?

Im using wordpress to develop a site ... I want to display everything in the first < p > < /p > tag and then wrap the rest of the content in a div, is this possible using jQuery?

to display the content im using the wordpress loop as follows:

query_posts(array('p' => 2, 'post_type' => 'p开发者_运维问答age'));
while (have_posts()) { the_post();
    the_content();
}

Cheers,


Styling the first paragraph would be cleaner, but if the intent is to encapsulate subsequent paragraphs in a container to hide them from view, then jQuery will allow you to do that. Sample code follows, your solution will obviously depend upon your particular setup.

<html>
<head>
<title>Home</title>
<script type="text/javascript"
  src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript">
  $(function() {
    var first = $("body p:first");
    first.addClass("first");
    var rest = first.siblings('p');
    var container = $("<div class='container'></div>").append(rest);
    first.after(container);
  });
</script>
</head>
<body>
  <h1>Hello world!</h1>

  <p>Paragraph 1</p>

  <p>Paragraph 2</p>

  <p>Paragraph 3</p>

  <p>Paragraph 4</p>

</body>
</html>


What I'd suggest is style the text you as you want it to display (including the first paragraph that you want to ultimately be different to the rest).

Once that's done, you can select the first paragraph with:

$('#container p:first').addClass('firstparagraph');

...and then use CSS to style .firstparagraph differently.

0

精彩评论

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