DOM-Document Object Model

最新推荐文章于 2024-11-11 17:28:03 发布

迪曼

最新推荐文章于 2024-11-11 17:28:03 发布

阅读量70

点赞数

文章标签： html javascript html5

本文链接：https://blog.csdn.net/qq_54010557/article/details/120201287

版权

JavaScript DOM操作 innerHTML 内容替换网页动态更新

关键词由CSDN通过智能技术生成

将显示的换成其他的来显示出来

		<p>
			你好
		</p>

主体结构

function changeContent(){
			var welcomeElement = document.getElementById("输入目标id");
			//获取id
			console.log( typeof welcomeElement );	
			console.log(welcomeElement.constructor.toString());
			//要取代的内容
			welcomeElement.innerHTML= "你好世界";
			}

给“你好”定义一个id，让var获取id，将要展示的内容取代id原来的展示

		<script>
			function changeContent(){
			//alert("ok")
			var welcomeElement = document.getElementById("welcome");
			//获取id
			console.log( typeof welcomeElement );	
			console.log(welcomeElement.constructor.toString());
			
			welcomeElement.innerHTML= "你好世界";
			}
		</script>
	</head>
	<body onload="changeContent()">

		<p id="welcome">
			你好
		</p>
	</body>