跳转页面并追加HTML,JS动态添加的div点击跳转到另一页面实现代码

div调用函数跳转:

var obj = document.getElementById('id');

obj.οnclick=function(){

window.location.href="跳转的地址" rel="external nofollow" ;

}

源文件:

首页推荐页面

div.recommendclass {

width: 100%;

height: 60px;

line-height: 60px;

vertical-align: middle;

font-size: 18px;

text-align: center; /*文字水平居中对齐*/

background-color: #f5f5f5;

}

.mall_contentChild1Class {

display: inline;

width: 40%;

height: 100px;

background-color: #f5f5f5;

}

.mall_contentChild2Class {

display: inline;

width: 60%;

height: 100px;

float: right;

position: relative;

background-color: #f5f5f5;

}

.mall_contentChild2BottomClass {

display: table-cell;

width: 90%;

vertical-align: bottom;

position: absolute;

left: 5px;

bottom: 5px;

background-color: #f5f5f5;

}

.mall_Child2TextLeftClass {

line-height: 16px;

vertical-align: bottom;

background-color: #f5f5f5;

}

.mall_Child2TextRightClass {

float: right;

color: #f3b041;

font-size: 25px;

line-height: 26px;

vertical-align: bottom;

background-color: #f5f5f5;

}

.news_title {

display: block;

font-size: 18px;

vertical-align: center;

background-color: #f5f5f5;

}

.news_message {

display: block;

font-size: 14px;

vertical-align: center;

background-color: #f5f5f5;

}

.news_time {

display: block;

font-size: 12px;

vertical-align: bottom;

position: absolute;

bottom: 5px;

right: 5px;

background-color: #f5f5f5;

}

新闻咨讯

var Shu = 2;

var df = document.createElement("div");

for (var i = 0; i <= Shu; i++) {

var oDiv = document.createElement("div");

var divChild1 = document.createElement("div");

divChild1.className = 'mall_contentChild1Class';

var img = document.createElement("img");

img.style.width = "130px";

img.style.height = "100px";

img.src = 'ic_mall_good_stuff.jpg';

divChild1.appendChild(img);

oDiv.appendChild(divChild1);

var divChild2 = document.createElement("div");

divChild2.className = 'mall_contentChild2Class';

var text1 = document.createElement("span");

text1.className = 'news_title';

text1.innerHTML = "我是标题";

divChild2.appendChild(text1);

var bottomDiv = document.createElement("div");

var textLeft = document.createElement("span");

textLeft.className = 'news_message';

textLeft.innerHTML = "我是内容";

bottomDiv.appendChild(textLeft);

var textRight = document.createElement("span");

textRight.className = 'news_time';

textRight.innerHTML = "2017.09.23";

bottomDiv.appendChild(textRight);

divChild2.appendChild(bottomDiv);

oDiv.appendChild(divChild2);

//添加点击事件

oDiv.onclick = function(){

window.location.href="file:///android_asset/news.html" rel="external nofollow" ;

}

df.appendChild(oDiv);

}

document.getElementById("news_content").appendChild(df);

总结

以上所述是小编给大家介绍的JS动态添加的div点击跳转到另一页面实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值