如何innerHTML没有id的HTML标签?

时间:2010-05-28 06:17:59

标签: javascript jquery

例如,我有这个HTML代码:

<div id="canvas">
    <div id="root">
        <div id="content">
            <span>
                <title>My SVG Example Title</title>
                <ellipse id="svg_1" />
            </span>
        </div>
    </div>
</div>

如何在不使用jQuery更改<span>标记的情况下innerHTML <title>标记? 所以我的预期输出将是这样的:

<div id="canvas">
    <div id="root">
        <div id="content">
            <span>
                <title>My SVG Example Title</title>
                <input type="text" value="this is the innerHTML I must insert but how?" />
            </span>
        </div>
    </div>
</div>

3 个答案:

答案 0 :(得分:3)

$('#canvas')
 .find('span')
 .contents()
 .not('title')
 .replaceWith($('<input />', {
    type: 'text',
    value: 'this is the innerHTML I must insert but how?'
 }));

答案 1 :(得分:2)

我会这样做:

var newHtml = '<input type="text" value="NewStuff!" />';

$("#svg_1").after(newHtml).remove();

答案 2 :(得分:0)

删除ellipse元素并添加input元素:

$("#content span ellipse").remove()
var input = $("<input>").attr("type", "text").attr("value", "foo");
$("#content span").append(input);