1

我正在尝试学习 Jquery，这就是问题所在。我去了解如何使用 Jquery 从锚元素中获取文本

alert($(this).text());

但问题是我不知道如何在页面上将此捕获的文本显示为 H2 标记 - 使用 Jquery ..

4

5 回答 5

1

获得文本后，您可以将其分配给元素...

<script>
$(function(){
    // (this) won't work here, needs to be an element, but you get the idea
    var str = $(this).text();
    $('#blah').html('<h2>'+str+'</h2>');
});
</script>

<div id="blah"></div>

..或更简单地说...

<script>
$(function(){
    $('#blah').html( $(this).text() );
});
</script>

<h2 id="blah"></h2>
于 2013-07-05T13:21:17.837 回答
1

好吧，如果您的 HTML 中有类似的内容

<div id="newh2placeholder"></div>

如果要添加到 div 中的当前元素，可以使用以下内容

var newHeader = $("<h2>"+$(this).text()+"</h2>");
$("#newh2placeholder").append(newHeader);

或者您可以使用它来完全替换内容

$("#newh2placeholder").html(newHeader);

但具体取决于你想做什么。我的意思是，你只需要记住$(str)表达式内部的字符串是一个 CSS 选择器，所以如果你有多个匹配项会导致它在多个地方重复，所以如果你的 html 是这样的

<div class='someClass'></div>
...
<div class='someClass'></div>

并且您使用类 CSS 选择器然后该操作将在多个地方重复

//to append
$(".someClass").append(newHeader);
//or to replace inner html
$(".someClass").html(newHeader);

这将导致动作在两者中重复

我还想创建一个函数来包装我的 HTML 标签元素

function wrapInTag(tag,target){
    return $("<"+tag">"+target+"</"+tag+">");
}

从那里你可以创建一个函数，它需要一个标签、目标数据和一个 css 选择器并为你工作

function appendToSelection(selector,tag,data){
    toAppend = wrapInTag(tag,data);
    return $(selector).append(toAppend);
}

function setInnerHtmlForSelection(selector,tag,data){
    newHtml = wrapInTag(tag,data);
    return $(selector).html(newHtml);
}

然后您只需在代码中使用该函数

data = $(this).text();
tag = "h2";
selection = "#newh2placeholder";
//if you want to append
result = appendToSelection(selection,tag,data);
//if you want to replace the html
result = setInnerHtmlForSelection(selection,tag,data);
于 2013-07-05T13:21:29.813 回答
0 
$('h2').text(
  $('#my-anchor-element').text();
).appendTo('#parent-element');
于 2013-07-05T13:21:26.707 回答
0

无论您要附加到什么容器，比如说一个 ID 为 的 div container：

$("#container").html("<h2>" + $(this).text() +"</h2>");
于 2013-07-05T13:21:49.990 回答
0

假设您有 HTML 部分，例如：

<div>
     <h2 id="my_h2"></h2>
     <a href="#" id="my_anchor">Some text to grab</a>
</div>

h2然后在用户点击后将文本放入my_anchor：

$('#my_anchor').click(function(){
     $('#my_h2').text($(this).text());
});
于 2013-07-05T13:22:07.877 回答