JS动态插入内容到DIV

html代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JS动态插入内容到DIV</title>
<meta name="keywords" content="" />
<meta name="description" content="JS动态插入内容到DIV" />
<base href="https://www.bbinhome.com" target="_blank" />
<link rel="miphtml" href="https://mip.bbinhome.com" />
<link rel="alternate" type="application/rss+xml" title="JS动态插入内容到DIV" href="https://www.bbinhome.com/rss.xml" />
<link rel="shortcut icon" href="favicon.ico" type="image/vnd.microsoft.icon" />
<link href="/templets/default/style/index.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="test.js">
</head>
<body>
<div id="test">
</div>

</body>
</html>

test.js 文件内容:

window.onload = function() {
var test = document.getElementById("test");
test.innerHTML="<p>JS动态插入内容到DIV</p>";
}

原文地址:https://www.cnblogs.com/bbinhome/p/10427099.html

时间: 2024-11-05 13:43:41

JS动态插入内容到DIV的相关文章

js动态插入的元素点击无效

当点击按钮1时为元素b动态添加类discounted,并对具有类discounted的元素b进行点击事件 $(".btn1").click(function(){ $(".b").addClass("discounted"); }); $(".b.discounted").on("click",function(){ alert("1111"); }) 以前以为动态插入的元素直接用on便

解决IE6下JS动态插入iframe不显示的方法

function myshowBox(titles, urls, objWidth, objHeight, flags) { var _title = titles; var _url = urls; var _width = objWidth; var _height = objHeight; var _flag = flags; $("body").append("<div class='myshowbox'><div class='myshowbox-

JavaScript 动态插入 CSS

写组件时有时想把一些组件特性相关的 CSS 样式封装在 JS 里,这样更内聚,改起来方便.JS 动态插入 CSS 两个步骤就可以 1 创建一个 style 对象2 使用 stylesheet 的 insertRule 或 addRule 方法添加样式 一.查看样式表 先看下 document.styleSheets,随意打开一个页面 其中前三个是通过 link 标签引入的 CSS 文件,第四个是通过 style 标签内联在页面里的 CSS.有如下属性 每一个 cssRule 又有如下属性 其中的

万能js实现翻页,动态生成内容自动翻页,兼容各种浏览器(已测试)----神器版!

转--http://www.2cto.com/kf/201402/277535.html 万能js实现翻页,动态生成内容自动翻页,兼容各种浏览器(已测试)----神器版! 2014-02-11      0个评论    来源:卡布洛技术专栏   收藏    我要投稿 要求:动态输入内容,点击post生成内容条,实现自动翻页! 废话不多说,直接上代码: js代码: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

js简单显示和隐藏div,触发超链接,动态更改button值,setInterval()简单使用,jquery easyui弹出框简单使用 .

js简单显示和隐藏div 01.<!DOCTYPE html> 02.<html> 03.<head> 04.<meta charset="UTF-8"> 05.<title>Insert title here</title> 06.<script type="text/javascript"> 07. window.onload=function(){ 08. document.g

【重要重要】如何在div是contentEditable=true的里面获取光标的位置,并在光标位置处插入内容。焦点位置插入指定内容

为什么要在contentEditable=true的div里面获取光标呢?因为这篇文章https://blog.csdn.net/qq_33769914/article/details/85002918我们知道想在一个内容里面插入一个新的内容,如果这个新的内容是段html代码.最后显示的是有样式的.那么用input是无法实现的. 所以我们考虑用contentEditable=true的div.在这里面输入的html就没问题啦.————————————————版权声明:本文为CSDN博主「夏天想」

js动态删除div元素

在做用户查找时 因为要把查找的结果动态加载和显示,所以,那些html元素要由Ajax动态生成.用户打开查找界面时,有系统推荐的用户,而当用户按条件查找后,查找的结果动态加载和显示.所以考虑到用js来搞. 这个for循环就是移除已有的表单.然后根据Ajax请求过来的数据,动态生成新的表单对象.一定要注意j变量从大往小循环,否则,删除div元素后会引起serchResultLenth=serchResult.children.length;长度的变化(这个问题摸索了好久,才搞定,切记) for(va

js动态创建及移除div的方法

本文实例讲述了js动态创建及移除div的方法.分享给大家供大家参考.具体实现方法如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 //创建div function createDiv(){  if(document.getElementByIdx_x("newD")!=null)   document.body.removeChild(document.getElementByIdx_x(&q

js 动态添加元素(div、li、img等)及设置属性

把一串 html 标签赋给一个 javascript 变量,除属性的值要用转义的双引号外,某些时候字符串还很长,显得有些复杂.如果用 js 动态添加元素,就不会有那么复杂的字符串出现,代码阅读性强一点,也容易理解. 网页是由 html 标签一层层组成的,js 也可以动态添加一层层的诸如 div.li.img 这样的标签.其实,不管是什么 html 标签,js 动态创建的方法都差不多,接着就先从动态添加 div 开始. 一.js 动态添加元素div <div id="parent"