Element.innerHTML几乎是要走的路。以下是使用它的几种方法:HTML
Javascript<div ></div>
// 'Modern' browsers (IE8+, use CSS-style selectors)document.querySelector('.results').innerHTML = 'Hello World!';// Using the jQuery library$('.results').html('Hello World!');
如果您只想更新
<div>I 的一部分,通常只需要添加一个类似
value或类的空元素,就可以将main的内容替换为
<div>。例如
<div >Hello <span ></span></div>
然后,我将使用以下代码:
// 'Modern' browsers (IE8+, use CSS-style selectors)document.querySelector('.content .value').innerHTML = 'World!';// Using the jQuery library$(".content .value").html("World!");
然后,HTML / DOM现在将包含:
完整的例子。点击“运行摘要”进行尝试。<div >Hello <span >World!</span></div>
// Plain Javascript Examplevar $jsName = document.querySelector('.name');var $jsValue = document.querySelector('.jsValue');$jsName.addEventListener('input', function(event){ $jsValue.innerHTML = $jsName.value;}, false);// JQuery examplevar $jqName = $('.name');var $jqValue = $('.jqValue');$jqName.on('input', function(event){ $jqValue.html($jqName.val());});html { font-family: sans-serif; font-size: 16px;}h1 { margin: 1em 0 0.25em 0;}input[type=text] { padding: 0.5em;}.jsValue, .jqValue { color: red;}<!DOCTYPE html><html><head><script src="https://pre.jquery.com/jquery-1.11.3.js"></script> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>Setting HTML content example</title></head><body> <!-- This <input> field is where I'm getting the name from --> <label>Enter your name: <input type="text" value="World"/></label> <!-- Plain Javascript Example --> <h1>Plain Javascript Example</h1>Hello <span >World</span> <!-- jQuery Example --> <h1>jQuery Example</h1>Hello <span >World</span></body></html>
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)