js动态创建html内容

 
更多

下面以动态创建 jiathis 分享组件来说明一下如何利用 js 动态创建 html 元素。

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>js动态创建html内容</title>
</head>

<body>
<div id="jiathis_style_32x32"></div>
<script language="javascript">
var jiathis_element=new Array(
	new Array(
		'分享到QQ空间',
		'jiathis_button_qzone'
	),
	new Array(
		'分享到新浪微博',
		'jiathis_button_tsina'
	),
	new Array(
		'分享到腾讯微博',
		'jiathis_button_tqq'
	),
	new Array(
		'分享到人人网',
		'jiathis_button_renren'
	),
	new Array(
		'分享到开心网',
		'jiathis_button_kaixin001'
	),
	new Array(
		'分享到朋友网',
		'jiathis_button_xiaoyou'
	),
	new Array(
		'分享到一键分享',
		'jiathis_button_ishare'
	),
	new Array(
		'分享到网易微博',
		'jiathis_button_t163'
	),
	new Array(
		'分享到百度搜藏',
		'jiathis_button_baidu'
	),
	new Array(
		'打印文章',
		'jiathis_button_print'
	),
	new Array(
		'添加到收藏夹',
		'jiathis_button_fav'
	),
	new Array(
		'分享到各大网站',
		'jiathis jiathis_txt jtico jtico_jiathis',
		'http://www.jiathis.com/share',
		'_blank'
	),
	new Array(
		'分享次数',
		'jiathis_counter_style'
	)
);
var testdiv=document.getElementById('jiathis_style_32x32');
for(var i=0;i<jiathis_element.length;i++){
	var para=document.createElement('a');
	para.setAttribute('rel','nofollow');
	para.setAttribute('title',jiathis_element[i][0]);
	para.setAttribute('class',jiathis_element[i][1]);
	if('undefined'!=typeof(jiathis_element[i][2])) para.setAttribute('href',jiathis_element[i][3]);
	if('undefined'!=typeof(jiathis_element[i][3])) para.setAttribute('target',jiathis_element[i][4]);
	testdiv.appendChild(para);
}
</script>
<script type="text/javascript" src="http://v2.jiathis.com/code/jia.js" charset="utf-8"></script>
</body>
</html>
打赏

本文固定链接: https://www.cxy163.net/archives/4160 | 绝缘体

该日志由 绝缘体.. 于 2013年05月23日 发表在 未分类 分类下, 你可以发表评论,并在保留原文地址及作者的情况下引用到你的网站或博客。
原创文章转载请注明: js动态创建html内容 | 绝缘体
关键字: , , , ,

js动态创建html内容:等您坐沙发呢!

发表评论


快捷键:Ctrl+Enter