jquery中 如何 使用 append() 方法 新添加的元素? $('#id').html()取不到值?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jquery中 如何 使用 append() 方法 新添加的元素? $('#id').html()取不到值?相关的知识,希望对你有一定的参考价值。

html: <div id="con"></div> jquery: $("#con").append("<div id='hello'>Hello</div>"); $("#hello").html() ; //这句 没有值,真的没别的办法? 不是#的问题,appendto()也是一样的。取不到

jquery是取不到后来添加的dom的。你要绑定事件倒可以用live方法。 参考技术A .append(
content
)
一个简单的例子
<!DOCTYPE
html>
<html>
<head>
<style>
p

background:yellow;

</style>
<script
src="http://code.jquery.com/jquery-1.4.4.js"></script>
</head>
<body>
<p>I
would
like
to
say:
</p>
<script>
$("p").append("<strong>Hello</strong>");
</script>
</body>
</html>
=========================================
我本地试了一下,这样可以取到值
<div
id="con"></div>
<div
id="result"></div>
<script>
$("#con").append("<div
id='hello'>Hello</div>");
$("#result").html($("#hello").html());
</script>
你可以看到有两个Hello

如何在不使用 jquery append 的情况下插入元标记?

【中文标题】如何在不使用 jquery append 的情况下插入元标记?【英文标题】:How to insert metatag without using jquery append? 【发布时间】:2011-12-04 09:56:44 【问题描述】:

我使用以下 jquery 将元标记插入到 html 文档中。

<script type="text/javascript">
if(screen.width>=320 && screen.width<=767)
$('head').append('<meta id="viewport" name="viewport" content="width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">');    
</script>

如果可能,我想在不使用 jquery 的情况下插入元标记。有人知道我该怎么做吗?

我相信我可能需要使用 document.getElementByTagName 但我不确定如何使用。

以防万一您想知道,我将元标记插入到我的 html 中,以优化网站以使用 iphone 进行查看。 不幸的是,width=device-width 不是一个选项,因为它与我的 ipad 版本不兼容。

【问题讨论】:

出于好奇,您确定移动设备会在检查元标记之前运行您的 Javascript 吗? 我已经在 ipad 和 iphone 上测试过它,它可以工作。不过是个好问题。我不确定其他任何设备。以后我会试试安卓的。 实际上,我收回了这一点。我发现 iphone 并没有始终如一地检测到元标记(至少我认为这是问题所在)。有时它起作用,有时它不起作用。我想我会改用 php 并重定向到特定的移动页面。 我注意到“content”属性中的分号是错误的,应该是逗号:“width=320, initial-scale=1, ...” 【参考方案1】:
var viewPortTag=document.createElement('meta');
viewPortTag.id="viewport";
viewPortTag.name = "viewport";
viewPortTag.content = "width=320, initial-scale=1.0, maximum-scale=1.0, user-scalable=0";
document.getElementsByTagName('head')[0].appendChild(viewPortTag);

【讨论】:

【参考方案2】:

您还可以使用“setAttribute”(而不是“点”表示法)来表示怪异的属性名称(包含非字母数字字符)。

例子:

var iefix=document.createElement('meta');
iefix.setAttribute("http-equiv", "X-UA-Compatible");
iefix.setAttribute("content", "IE=Edge");
document.getElementsByTagName('head')[0].appendChild(iefix);

以上示例导致 IE (

【讨论】:

【参考方案3】:

Javascript 解决方案:

document.getElementsByTagName('head')[0].innerHTML += '<meta id="viewport" name="viewport" content="width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">';

【讨论】:

【参考方案4】:

这是一个创建元标记的解决方案,如果它尚不存在:

var viewport = document.querySelector('meta[name=viewport]');
var viewportContent = 'width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0';

if (viewport === null) 
  var head = document.getElementsByTagName('head')[0];
  viewport = document.createElement('meta');
  viewport.setAttribute('name', 'viewport');
  head.appendChild(viewport);


viewport.setAttribute('content', viewportContent);

【讨论】:

以上是关于jquery中 如何 使用 append() 方法 新添加的元素? $('#id').html()取不到值?的主要内容,如果未能解决你的问题,请参考以下文章

如何通过 jQuery 的 .append() 添加 DOM 元素(Angular 指令)?

jquery中append()与appendto()用法分析

jquery中append和appendto的区别

如何来使用jquery动态的往页面添加元素

jquery在IE中使用append没有反映?

为啥jquery的append添加不了元素