js中insertAdjacentHTML()方法的用法

最新推荐文章于 2024-03-16 17:58:44 发布

Too_Soup_Soup

最新推荐文章于 2024-03-16 17:58:44 发布

阅读量668

点赞数 1

CC 4.0 BY-SA版权

分类专栏： HTML 文章标签： html javascript

本文链接：https://blog.csdn.net/Too_Soup_Soup/article/details/123604664

HTML 专栏收录该内容

9 篇文章

订阅专栏

insertAdjacentHtml(position,text);

在这里插入图片描述

<body>
		<ol>
			<li>第二名</li>
			<li>第三名</li>``
		</ol>
</body>

演示:

在这里插入图片描述

<body>
		<ol>
			<li>第二名</li>
			<li>第三名</li>``
		</ol>
</body>
<script type="text/javascript">
		var ols = document.querySelector("ol");
		ols.insertAdjacentHTML('beforebegin','<h2>班级排名</h2>')
		ols.insertAdjacentHTML('afterbegin','<li>第一名</li>');
		ols.insertAdjacentHTML('beforeend','<li>第四名</li>');
		ols.insertAdjacentHTML('afterend','<i style="color:red;">结束<i>');
</script>