Solved

jQuery Short hand Tag?

Posted on 2010-08-13
10
255 Views
Last Modified: 2013-11-11
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
Comment
Question by:wilson1000
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 3
  • 2
10 Comments
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 33427669
Insert a span in the innerHTML of an anchor that has no content already
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 33427702
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
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 33427723
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
Online Training Solution

Drastically shorten your training time with WalkMe's advanced online training solution that Guides your trainees to action. Forget about retraining and skyrocket knowledge retention rates.

 
LVL 7

Expert Comment

by:jhp333
ID: 33427852
@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
 
LVL 7

Expert Comment

by:jhp333
ID: 33427868
0
 
LVL 4

Author Comment

by:wilson1000
ID: 33427879
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
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 300 total points
ID: 33427958
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
 
LVL 7

Assisted Solution

by:jhp333
jhp333 earned 200 total points
ID: 33428038
I think that that live() has no merit, but possible side effects.
Just regular .click(function () {... would suffice.
0
 
LVL 4

Author Closing Comment

by:wilson1000
ID: 33428145
Thank you
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 33428326
Yes I thought the same about the live()
0

Featured Post

Resolve Critical IT Incidents Fast

If your data, services or processes become compromised, your organization can suffer damage in just minutes and how fast you communicate during a major IT incident is everything. Learn how to immediately identify incidents & best practices to resolve them quickly and effectively.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction JSON is an acronym for JavaScript Object Notation.  It is a text-string data transport mechanism, capable of representing simple or complex data structures in a consistent and easy-to-read manner.  Similar in concept to XML, but more e…
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)

739 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question