我正在尝试在svg元素中创建一个rect元素,但是它不起作用

时间:2019-12-12 04:13:49

标签: javascript html svg rect

为什么运行函数createRect()时红色矩形没有出现。任何帮助将不胜感激。

function createRect() {
    var rec = document.createElement("rect");
    rec.style.width = "100px";
    rec.style.height = "100px";
    rec.style.left = "0px";
    rec.style.top = "0px";
    rec.style.fill = "red";
    rec.style.position = "absolute";
    var elem = document.getElementById("container");
    elem.append(rec);


}

window.onload = createRect;
<!DOCTYPE html> 
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tetris(test)</title> 
    <link rel="stylesheet" href="styleSheets/main.css">
    <script src = "https://code.jquery.com/jquery-3.4.1.js"></script>
    <script src = "js/jquery.1.js"></script>
    <script src = "js/main.js"></script>
  </head>
  <body>
      <svg id="container" width= "500" height= "650" style= "background-color: black" position= "relative">
      </svg>

  </body>
</html>

在加载此功能后,左上角会出现一个红色框。

2 个答案:

答案 0 :(得分:3)

也许是

<!DOCTYPE html> 
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Tetris(test)</title> 
    <link rel="stylesheet" href="styleSheets/main.css">
    <script src = "https://code.jquery.com/jquery-3.4.1.js"></script>
    <script src = "js/jquery.1.js"></script>
    <script src = "js/main.js"></script>
  </head>
  <body>
      <svg id="container" width= "500" height= "650" style= "background-color: black">
      </svg>

  </body>
</html>

<script>
function createRect() {
const svgNS = "http://www.w3.org/2000/svg";
const svg = document.querySelector("svg");
const rec = document.createElementNS(svgNS ,'rect');
	rec.setAttribute('width', 100);
	rec.setAttribute('height', 100);
	rec.setAttribute('x', 50);
	rec.setAttribute('y', 50);
	rec.setAttribute('fill', 'red');
  
 svg.appendChild(rec);
}

window.onload = createRect;


</script>

答案 1 :(得分:1)

c = 299792458
kB = 1.380649*10**(-23)
T = 10000
m_he = 6.64424*10**(-27)
nun_he = 4.55746e+14
nuth_he = (2*kB*T/m_he)**(0.5)
konst2 = 11e+12

g(x) = 1-konst2/((pi)**(0.5)*(nuth_he))*exp(-((x-nun_he)**2)/(nuth_he**2))

set xtics rotate by -90

set term pngcairo size 800,1200 enhanced font "Segoe UI,18"
set output "out.png"

set format y "%4.2sx10^{%T}"       
x0=4.55746e+14
set xrange [x0-0.00001e+14:x0+0.00001e+14]
plot g(x) with lines lw 2.5 linecolor rgb "medium-blue", "<echo '4.55746e+14 1'" with points ls 7 ps 2