javascript修改html <b>标签内容
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了javascript修改html <b>标签内容相关的知识，希望对你有一定的参考价值。
<b id="name1">旧内容</b>在通过js 判断后要修改其里面的内容，请教如何实现。
document.getElementById('name1'). 什么属性 = "新内容"; ?????
javascript修改html <b>标签内容的示例如下：
<b>文字内容</b>document.getElementsByTagName(\'b\')[0].innerHTML = \'修改后的文字内容\';解释：
document.getElementsByTagName获取页面中指定标签的节点
这里用的是参数\'b\'代表获取文档中的所有b元素，结果是一个数组
由于示例的html只有1个b标签，所以获取第0个即所需修改的标签
innerHTML是对节点的html代码进行取值或修改
此处为该属性赋值，即修改了b标签的内容
参考技术A简单的实现，仅供参考：
<body><b style="width:100px; height:100px; border:1px solid #ccc;"></b>
</body>
<script type="text/javascript">
var oB = document.getElementsByTagName('b')[0];
var arr = [1,2,3,4,5,6,7,8,94,1,3,4,5,6];
oB.onclick=function()
oB.innerHTML = arr[Math.floor(Math.random()*arr.length)]; //修改DIV标签里面的内容
;
</script> 参考技术B document.getElementById('name1'). innerText = "新内容";
改变里面的文本
document.getElementById('name1'). innerHTML= "<div id=\"jiangxi\">新内容<\/div>";
改变里面的文本及html元素 参考技术C document.getElementById("name1").innerHTML="新内容";
or JQuery >
$("#name1").text("新内容");
or $("#name1").html("新内容"); 参考技术D innerHTML本回答被提问者采纳
javascript的简单查询和插入和修改
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="style/css.css" />
<script type="text/javascript">
window.onload = function() {
//创建一个"广州"节点,添加到#city下
myClick("btn01",function(){
var li = document.createElement("li");
var gz = document.createTextNode("广州");
li.appendChild(gz);
var city = document.getElementById("city");
city.appendChild(li);
});
myClick("btn02",function(){
var li = document.createElement("li");
var gz = document.createTextNode("广州");
li.appendChild(gz);
var city = document.getElementById("city");
city.insertBefore(li,bj);
});
myClick("btn03",function(){
var li = document.createElement("li");
var gz = document.createTextNode("广州");
li.appendChild(gz);
var city = document.getElementById("city");
city.replaceChild(li,bj);
});
myClick("btn04",function(){
var city = document.getElementById("city");
city.removeChild(bj);
});
myClick("btn04",function(){
var city = document.getElementById("city");
city.removeChild(bj);
});
myClick("btn05",function(){
var city = document.getElementById("city");
// var cns = city.children;
// for (let i=0;i<cns.length;i++)
// console.log(cns[i].innerHTML)
alert(city.innerText)
});
myClick("btn06",function(){
var bj = document.getElementById("bj");
bj.innerHTML="长坡";
});
myClick("btn07",function(){
var city = document.getElementById("city");
city.innerHTML+="<li>广州</li>";
});
};
function myClick(idStr, fun) {
var btn = document.getElementById(idStr);
btn.onclick = fun;
}
</script>
</head>
<body>
<div id="total">
<div class="inner">
<p>
你喜欢哪个城市?
</p>
<ul id="city">
<li id="bj">北京</li>
<li>上海</li>
<li>东京</li>
<li>首尔</li>
</ul>
</div>
</div>
<div id="btnList">
<div><button id="btn01">创建一个"广州"节点,添加到#city下</button></div>
<div><button id="btn02">将"广州"节点插入到#bj前面</button></div>
<div><button id="btn03">使用"广州"节点替换#bj节点</button></div>
<div><button id="btn04">删除#bj节点</button></div>
<div><button id="btn05">读取#city内的HTML代码</button></div>
<div><button id="btn06">设置#bj内的HTML代码</button></div>
<div><button id="btn07">创建一个"广州"节点,添加到#city下</button></div>
</div>
</body>
</html>
以上是关于javascript修改html <b>标签内容的主要内容，如果未能解决你的问题，请参考以下文章
JavaScript动态修改html组件form的action属性