<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>小米商域-小米11 ULtra、RedmiK40 Pro、MIX FOLD,小米电视...</title>
<link rel="shortcut icon" href="../images/favicon.ico" />
<link type="text/css" rel="stylesheet" href="../css/style.css" />
<script style="text/javascript" src="../js/index.js" defer="defer"></script>
</head>
<body>
<div class="site-topbar">
<div class="container">
<a href="">小米商域</a> <a href="">MINU</a> <a href="">Iot</a>
<a href="">云服务</a> <a href="">天星数科/a> <a href="">有品</a>
<a href="">小爱开发平台</a> <a href="">企业团购</a> <a href="">资质证照</a>
<a href="">协议规则</a> <a href="">下载app</a> <a href="">智能生活</a> <a href="">Select Location</a>
<a href="">登录</a> <a href="">注册</a> <a href="">消息通知</a>
<a href="" class="shopping_cart"><img src="../images/cart.png" alt="">购物车 (0)</a>
</div>
<div class="site-header">
<div class="container">
<div class="head-logo"><img src="../images/logo-mi2.png" alt=""></div>
<div class="header-nav">
<ul>
<li>小米手机</li>
<li>Redmi红米</li>
<li>电视</li>
<li>笔记本</li>
<li>平板</li>
<li>家电</li>
<li>路由器</li>
<li>智能硬件</li>
<li>服务</li>
<li>社区</li>
</ul>
</div>
</div>
</div>
<div class="home-hero-container container">
<ul>
<li>手机</li>
<li>电视</li>
<li>笔记本 平板</li>
<li>家电</li>
<li>出行 穿戴</li>
<li>智能 路由器</li>
<li>电脑 配件</li>
<li>健康 儿童</li>
<li>耳机 音箱</li>
</ul>
</div>
<div class="lunbotu"><img src="../images/小米5.webp" alt=""></div>
<div class="home-hero-sub row">
<div class="span4"><ul>
<li><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/82abdba456e8caaea5848a0cddce03db.png?w=48&h=48" >保障服务</li>
<li><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/806f2dfb2d27978e33fe3815d3851fa3.png?w=48&h=48">企业团购</li>
<li><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/eded6fa3b897a058163e2485532c4f10.png?w=48&h=48">F码通道</li>
<li><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/43a3195efa6a3cc7662efed8e7abe8bf.png?w=48&h=48">米粉卡</li>
<li><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/f4846bca6010a0deb9f85464409862af.png?w=48&h=48">以旧换新</li>
<li><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/9a76d7636b08e0988efb4fc384ae497b.png?w=48&h=48">话费充值</li>
<!-- <li>企业团购</li>
<li>F码通道</li>
<li>米粉卡</li>
<li>以旧换新</li>
<li>话费充值</li> -->
</ul></div>
<div class="span16">
<ul class="home-promo-list clearfix">
<li class="first"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/d8a6d6d37904e22c72130e3e4ec79b41.jpg?w=632&h=340" alt=""></li>
<li class="first"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/d8a6d6d37904e22c72130e3e4ec79b41.jpg?w=632&h=340" alt=""></li>
<li class="first"><img src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/d8a6d6d37904e22c72130e3e4ec79b41.jpg?w=632&h=340" alt=""></li>
</ul>
</div>
</div>
<div class="page-main home-main">
<div class="container">
<div class="home-banner-box"><a href="#"><img src="../images/k40.webp" alt=""></a></div>
</div>
<div class="home-brick-box home-brick-row-2-box xm-plain-box">
<div class="box-hd">
<h2>手机</h2>
<div class="more">查看更多<img src="../images/morn-icon.png" alt=""></div>
</div>
</div>
</div>
<div class="shoujizhanshi"><img src="../images/小米折叠屏.webp" alt=""></div>
<div class="shoujilist"><ul>
<li><img src="../images/xiaomiMIX4.webp" alt=""><h2>Xiaomi MIX4</h2></li>
<li><img src="../images/Note 10 PRO.webp" alt=""><h2>Note 10 PRO</h2></li>
<li><img src="../images/Redmi Note 10.webp" alt=""><h2>Redmi Note 10</h2></li>
<li><img src="../images/小米MIX FOLD.webp" alt=""><h2>小米MIX FOLD</h2></li>
<li><img src="../images/小米11 Ulttra.webp" alt=""><h2>小米11 Ulttra</h2></li>
<li><img src="../images/小米11 Pro.webp" alt=""><h2>小米11 Pro</h2></li>
<li><img src="../images/小米11青春版.webp" alt=""><h2>小米11青春版</h2></li>
<li><img src="../images/K40游戏增强版.webp" alt=""><h2>K40游戏增强版</h2></li>
</ul></div>
</div>
<div class="yemiandibu">
<div class="site-footer">
<div class="container">
<div class="footer-service"><ul class="list-service">
<li><a href="https://www.mi.com/service/quick-repair"><img src="../images/预约维修服务.png" alt="">预约维修服务</a></li>
<li><a href="https://www.mi.com/service/quick-repair"><img src="../images/7天无理由.png" alt="">7天无理由退货</a></li>
<li><a href="https://www.mi.com/service/quick-repair"><img src="../images/15天免费换.png" alt="">15天免费换货</a></li>
<li><a href="https://www.mi.com/service/quick-repair"><img src="../images/礼物-icon.png" alt="">满69包邮</a></li>
<li><a href="https://www.mi.com/service/quick-repair"><img src="../images/位置-icon.png" alt="">520余家售后网点</a></li>
</ul></div>
</div>
<div class="fuqin">
<dl class="col-links col-links-first"><dt>帮助中心</dt>
<dd>账户管理</dd>
<dd>购物指南</dd>
<dd>订单操作</dd></dl>
<dl class="col-links col-links-first"><dt>服务支持</dt>
<dd>售房政策</dd>
<dd>自助服务</dd>
<dd>相关下载</dd></dl>
<dl class="col-links col-links-first"><dt>线下门店</dt>
<dd>小米之家</dd>
<dd>服务网点</dd>
<dd>授权体验店</dd></dl>
<dl class="col-links col-links-first"><dt>关于小米</dt>
<dd>了解小米</dd>
<dd>加入小米</dd>
<dd>投资者关系</dd><dd>企业社会责任</dd><dd>廉洁举报</dd></dl>
<dl class="col-links col-links-first"><dt>关注我们</dt>
<dd>新浪微博</dd>
<dd>官方微信</dd>
<dd>联系我们</dd><dd>公益基金会</dd></dl>
<dl class="col-links col-links-first"><dt>特色服务</dt>
<dd>F码通道</dd>
<dd>礼物码</dd>
<dd>防伪查询</dd></dl>
</div>
</div>
</div>
<div class="site-info">
<div class="container">
<div class="head-logo"><img src="../images/logo-mi2.png" alt=""></div>
<div class="info-text">
<p class="sites">
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">小米商城</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">MIUI</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">米家</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">米聊</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">多看</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">游戏</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">政企服务</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">小米天猫店</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">小米集团隐私政策</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">小米公司儿童信息保护规则</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">小米商城隐私政策</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">小米商城用户协议</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">问题反馈</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">Select Location</a>
<span class="sep">|</span>
</p>
<p class="sites">
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">北京互联网法院法律服务工作站</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">中国消费者协会</a>
<span class="sep">|</span>
<a rel="nofollow" href="http://www.mi.com/index.html" target="_blank">北京市消费者协会</a>
<span class="sep">|</span>
</p>
<p class="sites sites-three">
©
<a href="javascript:;" target="_blank" title="mi.com">mi.com</a> 京ICP证110507号
<a href="http://beian.miit.gov.cn/" target="_blank" rel="nofollow">京ICP备10046444号</a>
<a rel="nofollow" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010802020134" target="_blank">京公网安备11010802020134号</a>
<a href="//www.mi.com/culture-license/" target="_blank">京网文[2020]0276-042号</a>
<br>
<a href="//www.mi.com/medical/record/" target="_blank">(京)网械平台备字(2018)第00005号</a>
<a href="//www.mi.com/medical/qualification/" target="_blank">互联网药品信息服务资格证 (京)-非经营性-2014-0090</a>
<a href="//www.mi.com/business-license/" target="_blank">营业执照</a>
<a href="//www.mi.com/medical/list/" target="_blank">医疗器械质量公告</a>
<br>
<a href="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/e0c7d4cf3b7cd88de10196e30c92e020.png" target="_blank">增值电信业务许可证</a> 网络食品经营备案 京食药网食备202010048
<a href="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/c6859168166651511897f54fa1047fe3.png" target="_blank">食品经营许可证</a>
<br>
违法和不良信息举报电话:171-5104-4404 <a href='https://www.mi.com/intellectual' target="_blank">知识产权侵权投诉</a> 本网站所列数据,除特殊说明,所有数据均出自我司实验室测试
</p>
</div>
<div class="info-links">
<a rel="nofollow" href="//privacy.truste.com/privacy-seal/validation?rid=4fc28a8c-6822-4980-9c4b-9fdc69b94eb8&lang=zh-cn" target="_blank">
<img rel="nofollow" src="http://i1.mifile.cn/f/i/17/site/truste.png" alt="TRUSTe Privacy Certification">
</a>
<a rel="nofollow" href="//search.szfw.org/cert/l/CX20120926001783002010" target="_blank">
<img rel="nofollow" src="http://s01.mifile.cn/i/v-logo-2.png" alt="诚信网站">
</a>
<a id="_xinchacharenzheng_cert_vip_kexinweb" rel="nofollow" href="//xyt.xinchacha.com/pcinfo?sn=523009637759455232&certType=6" target="_blank">
<img rel="nofollow" src="http://xyt.xinchacha.com/img/icon/icon3.png" alt="可信网站">
</a>
<a rel="nofollow" href="//www.mi.com/service/buy/commitment/" target="_blank">
<img rel="nofollow" src="http://i8.mifile.cn/b2c-mimall-media/ba10428a4f9495ac310fd0b5e0cf8370.png" alt="诚信经营 放心消费">
</a>
<a rel="nofollow" id="tupianqiehuan" href="https://webcert.cnmstl.net/cert/grade?sn=3af21034e35011eab3ea00163e068ceb" class="safe-auth J_safeAuth" >
<img rel="nofollow" id="img1" src="https://cnbj1.fds.api.xiaomi.com/b2c-misite-activity/f1ee261b96ae71e845efba398efeca02.png" class="img1" >
<img rel="nofollow" id="img2" src="https://cnbj1.fds.api.xiaomi.com/b2c-misite-activity/8886a16cf5391f3b4c4b327ff6afc4de.png" class="img2" >
</a>
</div>
</div>
</div>
</body>
</html>
a:link {
text-decoration: none;
color: white;
}
a:visited {
text-decoration: none;
color: white;
}
a:hover {
text-decoration: none;
color: rgba(255, 255, 255, 0.281);
}
a:active {
text-decoration: none;
color: white;
}
/* div {
display: inline-block;
} */
body {
/* height: 10000px; */
}
.container {
width: 1226px;
/* background: red; */
margin-right: auto;
margin-left: auto;
font-size: 12px;
color: #b0b0b0;
}
.site-topbar {
height: 40px;
background: #333;
}
a {
display: inline-block;
line-height: 40px;
}
.container a img {
margin: -8px auto;
}
.site-header {
height: 100px;
}
.site-header img {
width: 56px;
height: 56px;
margin-top: 22px;
}
.header-nav ul li {
display: inline;
/* float: left; */
font-size: 16px;
color: #000;
padding: 26px 10px 38px;
}
.site-header .container .header-nav {
margin-top: 25px;
margin-left: 100px;
}
.site-header .container div {
float: left;
}
.home-hero-container {
font-size: 14px;
color: #000;
float: left;
margin-left: 130px;
background-color: gray;
width: 196px;
}
.home-hero-container ul li {
list-style: none;
margin-bottom: 15px;
}
.lunbotu img {
height: 321px;
width: 997px;
}
.home-hero-sub .span4 {
width: 196px;
height: 170px;
background-color: gray;
margin-left: 130px;
margin-top: 15px;
float: left;
}
.home-hero-sub .span4 ul {
display: block;
float: left;
margin-left: -19px;
}
.home-hero-sub .span4 ul li {
display: inline;
font-size: 12px;
list-style: none;
float: left;
margin-bottom: 28px;
margin-left: 3px;
}
.home-hero-sub .span4 ul li img {
width: 24px;
display: block;
margin: 0 auto 4px;
}
.span16 {
float: left;
width: 1016px;
/* background-color: red; */
}
.span16 .home-promo-list ul {
display: block;
padding-left: 0px;
}
.span16 .home-promo-list ul li {
display: inline;
float: left;
}
.span16 .home-promo-list .first {
list-style: none;
}
.span16 .home-promo-list .first img {
width: 316px;
float: left;
margin-right: 5px;
}
.page-main .container .home-banner-box a img {
width: 1196px;
margin-top: 10px;
margin-left: -8px;
}
.home-brick-box .box-hd {
height: 50px;
/* background-color: red; */
}
.box-hd h2 {
display: block;
float: left;
margin-right: 1045px;
margin-left: 132px;
}
.more {
float: left;
margin-top: 27px;
}
.more img {
width: 15px;
padding-top: 0px;
}
.shoujizhanshi {
width: 15%;
margin-left: 123px;
/* background-color: rgb(235, 231, 231); */
float: left;
}
.shoujizhanshi img {
width: 226px;
}
.shoujilist {
/* background-color: rgb(228, 222, 222); */
height: 598px;
float: left;
}
.shoujilist ul {
width: 1012px;
/* background-color: red; */
height: 500px;
}
.shoujilist ul li {
list-style: none;
display: inline;
float: left;
/* margin-bottom: 32px; */
}
.shoujilist ul li h2 {
margin-left: 91px;
/* font-weight: normal; */
font-size: 12px;
}
.yemiandibu {
/* background-color: green; */
height: 300px;
float: left;
margin-left: 117px;
}
.site-footer .container .footer-service {
}
.site-footer .container .footer-service ul {
margin-top: 5px;
}
.site-footer .container .footer-service ul li {
margin-right: 107px;
list-style: none;
float: left;
}
.site-footer .container .footer-service ul li a {
color: black;
font-size: 16px;
}
.site-footer .container .footer-service ul li img {
display: inline;
}
.col-links-first {
float: left;
margin-right: 136px;
}
.col-links-first dt {
margin-bottom: 26px;
}
.col-links-first dd {
margin: 10px 0 0;
font-size: 12px;
}
.fuqin dl:nth-child(1) {
margin-left: 121px;
}
.site-info {
float: left;
width: 100%;
}
.site-info .container .head-logo {
width: 343px;
}
.site-info .container .head-logo img {
width: 56px;
height: 56px;
margin-left: 66px;
float: left;
}
.site-info .container .info-text {
float: left;
margin-top: 1px;
width: 1100px;
}
.site-info .container .info-text .sites {
margin: 0px;
}
.site-info .container .info-text .sites a {
color: black;
line-height: 12px;
}
.site-info .container .info-text .sites-three a {
color: #b0b0b0;
line-height: 12px;
}
.info-links {
margin-left: 120px;
}
.info-links a img {
width: 83.01px;
height: 28px;
}
/* #img2 {
display: none;
} */
function qiehuantupian() {
// var picture = document.getElementById('tupianqiehuan');
// console.log(picture);
var img1 = document.getElementById('img1');
var img2 = document.getElementById('img2');
img1src = img1.src;
img2src = img2.src;
console.log(img2);
for (i = 0; i < 100; i++){
if (i % 2 == 0) {
// img1.style.display = 'none';
// img2.style.display = 'visibility';
// console.log(1);
// console.log(img1.style.display);
// console.log(img2.style.display);
// img1.src = '';
// img2.src = img2src;
img1.style.display = 'none';
img2.style.display = 'unset';
} else {
// img2.style.display = 'none';
// img1.style.display = 'visibility';
// console.log(2);
// console.log(img1.style.display);
// console.log(img2.style.display);
// img2.src = '';
// img1.src = img1src;
img2.style.display = 'none';
img1.style.display = 'unset';
}
}
}
qiehuantupian();
<html>
<head>
<meta charset="UTF-8" />
<title>js-是动态实现图片显示</title>
<script type="text/javascript">
//设置图片的动态效果
function photoOper(ph, photo) {
//获取图片对象
//var ph=document.getElementById(id); //可以通过id获得,但是没必要,我们可以直接使用this直接把对象传过来
// 鼠标移动过去就会有一个边框
ph.style.border = "solid 1px"; //我们是重新赋值,所以我们要用=赋值符,而不是:各个是属性说明
// console.log(ph);s
//在大屏块显示
big.src = photo; //传过来的数据就已经是一个字符串类型了,虽然我们src的值需要是字符串,但是如果再加一个""就会导致路径不明,这样其实际图片名相当于带了""
console.log(photo);
} //src是big的属性的是不是样式属性,可以直接调用修改,不用加style
function photoOper2(ph) {
ph.style.border = ""; //移出后边框值没
// console.log(ph);
}
</script>
<style type="text/css">
#showdiv {
width: 500px;
height: 440px;
border: solid 1px;
border-radius: 15px;
}
#ta {
margin: auto;
margin-top: 10px;
margin-left: 10x;
}
img {
margin-left: 3px;
}
</style>
</head>
<body>
<div id="showdiv">
<table id="ta">
<tr>
<td colspan="4" width="490px" height="344px">
<img
src="http://demo.jb51.net/js/2018/html5-css3-3d-img-flash-codes/images/Guardians-of-the-Galaxy-Poster-High-Res.jpg"
width="490px"
id="big"
/>
</td>
</tr>
<tr>
<td height="68px">
<img
src="http://demo.jb51.net/js/2018/html5-css3-3d-img-flash-codes/images/Blade-Runner-poster-art-Harrison-Ford.jpg"
height="65px"
id="p1"
onmousemove="photoOper(this,'http://demo.jb51.net/js/2018/html5-css3-3d-img-flash-codes/images/Blade-Runner-poster-art-Harrison-Ford.jpg')"
onmouseout="photoOper2(this)"
/>
</td>
<td>
<img
src="http://demo.jb51.net/js/2018/html5-css3-3d-img-flash-codes/images/2017_alien_covenant_4k-5120x2880-1920x1080.jpg"
height="65px"
onmousemove="photoOper(this,'http://demo.jb51.net/js/2018/html5-css3-3d-img-flash-codes/images/2017_alien_covenant_4k-5120x2880-1920x1080.jpg')"
onmouseout="photoOper2(this)"
/>
</td>
<td>
<img
src="http://demo.jb51.net/js/2018/html5-css3-3d-img-flash-codes/images/robocop-1987-wallpaper-2.jpg"
height="65px"
onmousemove="photoOper(this,'http://demo.jb51.net/js/2018/html5-css3-3d-img-flash-codes/images/robocop-1987-wallpaper-2.jpg')"
onmouseout="photoOper2(this)"
/>
</td>
<td>
<img
src="http://demo.jb51.net/js/2018/html5-css3-3d-img-flash-codes/images/sJALsDXak4EehSg2F2y92rt5hPe.jpg"
height="65px"
onmousemove="photoOper(this,'http://demo.jb51.net/js/2018/html5-css3-3d-img-flash-codes/images/sJALsDXak4EehSg2F2y92rt5hPe.jpg')"
onmouseout="photoOper2(this)"
/>
</td>
</tr>
</table>
</div>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
</head>
<body>
<div>
<img id="img1" src="../images/小米11 Pro.webp" alt="" />
<img id="img2" src="../images/小米11 Pro.webp" alt="" />
<img id="img3" src="../images/小米11 Pro.webp" alt="" />
</div>
</body>
<script>
// while (true) {
// console.log("nihao");
// }
for (i = 0; i < 10000; i++) {
console.log(i);
}
function tupian() {
img1 = document.getElementById("img1");
console.log(img1);
}
tupian();
// setInterval(tupian(), 40000);
// function chuxian() {
// img1 = document.getElementById("img1");
// console.log(img1);
// img1.style.display = "unset";
// }
// setInterval(chuxian(), 2000);
</script>
</html>
https://blog.csdn.net/qq_38362772/article/details/84873136