使用 jQuery 获取点击的元素 html？

Question

I'm listening for clicks of a number of element's. I want to show an alert when an user clicks on one, the alert's content should be the clicked element's innerHtml.

$(".tags-container > p").click(function (event) {
    alert('inner html');
    });

I could do it by adding the code to the html, but I prefer to use a jquery listener.

How can I show the element's innerHTML on the alert?

Answer 1

Get the HTML out of the <p> tag using jQuery's html() :

$(".tags-container > p").click(function(event) {
    alert($(this).html());
});​

Get the HTML out of the <p> tag using JavaScript's innerHTML :

$(".tags-container > p").click(function(event) {
    alert(this.innerHTML);
});​

Get just the text out of the <p> tag using jQuery's text() , which will strip out any HTML and return the combined text.

$(".tags-container > p").click(function(event) {
    alert($(this).text());
});​

Answer 2

$(".tags-container > p").click(function () {
    alert($(this).html());
});

Answer 3

use jQuery's html() function

$(".tags-container > p").click(function (event) {
    alert($(this).html());
    });

a working example: http://jsfiddle.net/ukxvp/

Answer 4

Like they said, just use $.html(). Personally, I'd just use innerHTML because $.html() filters out br elems and such; I'd just turn them into newlines.

$(".tags-container > p").click(function () {
   alert(this.innerHTML.replace(/<br>/, '\n'));
});