[Webinar] Streamline your web hosting managementRegister Today

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 265
  • Last Modified:

jQuery Short hand Tag?

Hi Experts,

I can't seem to find any information regarding the type of tag used in the following code snippet.

Would someone be kind enough to explain the syntax please?

Many thanks
$("<a/>").html("<span class=\"verdana\">&laquo; &nbsp;</span>Prev")

Open in new window

0
wilson1000
Asked:
wilson1000
  • 5
  • 3
  • 2
2 Solutions
 
Michel PlungjanIT ExpertCommented:
Insert a span in the innerHTML of an anchor that has no content already
0
 
Michel PlungjanIT ExpertCommented:
However it does not seem to work

Here are all selectors
http://api.jquery.com/category/selectors/

can you post the code where it appears?
0
 
Michel PlungjanIT ExpertCommented:
My test data

<html>
    <head>
      <title></title>
      <script src="http://code.jquery.com/jquery-1.4.2.min.js" type="text/javascript"></script>  
    </head>
    <body>
    <a/>
    <a></a>
    <div id="test"></div>
  <script>
  $("<a/>").html("<span class=\"verdana\">&laquo; &nbsp;</span>Prev")
  $("#test").html("<span class=\"verdana\">&laquo; &nbsp;</span>Prev")
  $("a").html("<span class=\"verdana\">&laquo; &nbsp;</span>Prev")
  </script>
    </body>
  </html>

Open in new window

0
Never miss a deadline with monday.com

The revolutionary project management tool is here!   Plan visually with a single glance and make sure your projects get done.

 
jhp333Commented:
@mplungian

If you pass a HTML string to jQuery function, $(), it just generates the DOM element(s), similar to JavaScript createElement(), but you can pass any HTML string with many elements in it.
You need to insert it in the DOM tree in order to see it, using one of jQuery methods like append(), prepend(), insertAfter() and so on.

And... html() does not insert, it replaces the innerHTML.
0
 
jhp333Commented:
0
 
wilson1000Author Commented:
Hi, thanks for your post

This does work, I just wanted to understand the syntax a little better.

If you take a look at the following link you'll notice the pagination at the very top of the page. Click a digit or the next button and the "Prev" link appears.

http://www.pc-site.co.uk/dell/#pag

I've added a little more of the script below to help shed some light but due to NDA I can't release the rest, apologies for that.

Thanks again


$("<a/>").html("<span class=\"verdana\">&laquo; &nbsp;</span>Prev").attr("href", "#").live( 'click',(function() {
				func_tool(tool,tableid,(currpage-1));
				return false;
			})).appendTo("#pagination").wrap("<span class=\"prev\"></span>");

Open in new window

0
 
Michel PlungjanIT ExpertCommented:
Ah

it was the appendto we missed

$("<a/>").html("<span class=\"verdana\">&laquo; &nbsp;</span>Prev").appendTo('body')

That makes sense.

So jhp said it:

$("<a/>") // create a link
.html("<span class=\"verdana\">&laquo; &nbsp;</span>Prev") // replace the innerHTML
.attr("href", "#") // set the href to #
.live( 'click',(....) // attach/bind an event handler to all current and future links
.appendTo("#pagination") // append this link to the object with id="pagination"
.wrap("<span class=\"prev\"></span>") // wrap the link I guess

I would expect the wrap to come before the append


<div id="pagination" class="nicepagination center">
  <span class="prev">
    <a href="#" style="">
      <span class="verdana">« &nbsp;</span>Prev
    </a>
  </span>
.
.
.
</div>

Open in new window

0
 
jhp333Commented:
I think that that live() has no merit, but possible side effects.
Just regular .click(function () {... would suffice.
0
 
wilson1000Author Commented:
Thank you
0
 
Michel PlungjanIT ExpertCommented:
Yes I thought the same about the live()
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

  • 5
  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now