怎么用JS输入HTML代码?

发布网友发布时间：2022-04-24 17:33

共4个回答

热心网友时间：2022-04-23 01:02

<!DOCTYPE HTML>
<html lang="zh-CN">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" />
    <meta name="format-detection" content="telephone=no" />
<title>tryMyOwnCalendar</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="application/javascript" language="javascript">  </script>
    <style>
  *{ margin:0; padding:0;}
     .choosecal{ width:96%; margin:3% auto; overflow:hidden;}
  .ccaltop{ width:100%; border-radius:5px; }
  .caltline1,.caltline2{ width:94%; background-color:#F90; overflow:hidden; padding:2% 3%;}
  .caltline1 p,.caltline2 p{ float:left; width:10%; font-weight:700; text-align:right;}
  .caltline1 .bookdate{ width:90%; text-align:left;}
  .caltline2{ background-color:#FFF; display:none;}
  .caltline2 p{ width:20%;}
  .caltline2 .datetext{ width:35%; border:1px solid #000; background-color:#FFF; font-weight:700;}
  .inputdate{ color:#F60;}

  .calender{ width:100%; margin-top:3%; overflow:hidden; display:none;}
  .selectmouth{ background-color:#F30; width:94%; overflow:hidden;padding:2% 3%;border-radius:5px 5px 0 0;}
  .selectmouth p{ float:left; width:33%; color:#FFF; font-weight:700; cursor:pointer;}
  .selectmouth .selectdate{ width:100%; background-color:#F30; border:none; color:#FFF; font-weight:700; text-align:center;}

  .data_table{ width:100%;border:1px solid #cccccc;border-collapse:collapse; }
  .data_table thead{ background-color:#333;}
  .data_table thead td{ color:#FFF; text-align:center;border:1px solid #333;border-collapse:collapse; padding:1% 0;}
  .data_table tbody td{border:1px solid #cccccc;border-collapse:collapse; text-align:center;color:#0C6;padding:1% 0;}
  .data_table tbody td.orderdate{ color:#000;}
  .data_table tbody td.tdselect{ color:#fff;background-color:#999}
    </style>
</head>

<body>
<div class="choosecal">
     <div class="ccaltop">
         <div class="caltline1">
             <p class="bookdate">选择入住日期……</p>
                <p><img src="https://js.alixixi.com/demo/CompactNewsPreviewer/images/next.png" /></p>

热心网友时间：2022-04-23 02:20

JS输入输出HTML代码有2种方式：
1、在需要输出的的位置写JS代码：<script>document.write('需要输出的内容')</script>
比如：
<ul>
<script>document.write('<li><a href="/wap2/newsPage/1320">5</a></li><li><a href="/wap2/newsPage/1319">4</a></li><li><a href="/wap2/newsPage/1318">3</a></li><li><a href="/wap2/newsPage/1317">2</a></li><li><a href="/wap2/newsPage/1316">1</a></li>');
</script>
</ul>
2、采用js的innerHTML方法：
例子;
<ul id="ul"></ul>
<script>
document.getElementById("ul").innerHTML='<li><a href="/wap2/newsPage/1320">5</a></li><li><a href="/wap2/newsPage/1319">4</a></li><li><a href="/wap2/newsPage/1318">3</a></li><li><a href="/wap2/newsPage/1317">2</a></li><li><a href="/wap2/newsPage/1316">1</a></li>';
</script>

热心网友时间：2022-04-23 03:54

html代码

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<link href="mycss.css" rel="stylesheet" type="text/html" />
</head>
<body>
<div id="temp"></div>
</body>
<script type="text/javascript" src="myjs.js"></script>
</html>
mycss.css的代码

#temp {
width: 100px;
height: 100px;
background: black;
}
myjs.js的代码

window.onload = function(){
alert("写给怎么在HTML页面中引用JS,CSS文件? 麻烦写个具体代码");
};
以上三个文件都是放在同一个目录下的，如果需要在不同的目录下请修改css的href和js的src即可

热心网友时间：2022-04-23 05:46

document.writeln("<ul>");
document.writeln(" <li><a href=\"/wap2/newsPage/1320\">5</a></li>");
document.writeln(" <li><a href=\"/wap2/newsPage/1319\">4</a></li>");
document.writeln(" <li><a href=\"/wap2/newsPage/1318\">3</a></li>");
document.writeln(" <li><a href=\"/wap2/newsPage/1317\">2</a></li>");
document.writeln(" <li><a href=\"/wap2/newsPage/1316\">1</a></li>");
document.writeln("</ul>");
下面有站长工具，可以直接转换。

参考资料：http://tool.chinaz.com/Tools/Html_Js.aspx