Skip to content

H
html-shot
Commit 44268c0d authored by rockyl's avatar rockyl
Browse files
Options

修复src(unknown)时报错的问题

parent 74049f7a
Hide whitespace changes
Inline Side-by-side
Showing with 60 additions and 43 deletions
package.json
View file @ 44268c0d
{
"name": "html-shot",
"version": "1.0.18",
"version": "1.0.19",
"main": "dist/index.js",
"types": "types/index.d.ts",
"license": "MIT",
......
src/dom-parser.ts
View file @ 44268c0d
......@@ -35,10 +35,11 @@ export function parseDom(el: HTMLElement = document.body) {
switch (childNode.nodeName) {
case 'IMG':
node = childNode;
if (node.src) { //过滤src为空的图片
const src = node.getAttribute('src') //必须使用此方法，使用node.src且为空时会返回当前页面链接
if (src) { //过滤src为空的图片
vNode = {
type: 2,
src: node.src,
src,
}
}
break;
......@@ -93,7 +94,7 @@ export function parseDom(el: HTMLElement = document.body) {
type: 0,
}
}
if(styles[skey] !== undefined){
if (styles[skey] !== undefined) {
vNode[skey] = styles[skey];
}
}
......
test.html
View file @ 44268c0d
......@@ -6,55 +6,60 @@
<script src="//yun.duiba.com.cn/js-libs/rem/1.1.0/rem.min.js"></script>
<script src="https://cdn.staticfile.org/react/16.4.0/umd/react.development.js"></script>
<script src="https://cdn.staticfile.org/react-dom/16.4.0/umd/react-dom.development.js"></script>
<!-- 生产环境中不建议使用 -->
<script src="https://cdn.staticfile.org/babel-standalone/6.26.0/babel.min.js"></script>
<style>
.poster {
position: relative;
background-color: orange;
border-radius: 2.00rem;
border: 0.1rem solid blue;
width: 5.20rem;
height: 4.40rem;
}
.poster {
position: relative;
background-color: orange;
border-radius: 2.00rem;
border: 0.1rem solid blue;
width: 5.20rem;
height: 4.40rem;
}
.bg {
background-image: url("//yun.duiba.com.cn/aurora/14e3d0fa0e1ff54553a2c8c094b1caffd90f0a43.png");
background-size: 100% 100%;
width: 5.2rem;
height: 4.4rem;
}
.bg {
background-image: url("//yun.duiba.com.cn/aurora/14e3d0fa0e1ff54553a2c8c094b1caffd90f0a43.png");
background-size: 100% 100%;
width: 5.2rem;
height: 4.4rem;
}
.avatar {
border-radius: 1.00rem;
width: 5.20rem;
height: 4.40rem;
}
.avatar {
border-radius: 1.00rem;
width: 5.20rem;
height: 4.40rem;
}
.ppp {
color: green;
font-size: 0.50rem;
font-weight: bold;
position: absolute;
left: 0.10rem;
top: 0.10rem;
text-align: center;
width: 1.00rem;
word-wrap: break-word;
font-family: Arial;
font-style: italic;
background-color: red;
}
.ppp {
color: green;
font-size: 0.50rem;
font-weight: bold;
position: absolute;
left: 0.10rem;
top: 0.10rem;
text-align: center;
width: 1.00rem;
word-wrap: break-word;
font-family: Arial;
font-style: italic;
background-color: red;
}
</style>
</head>
<body>
<div id="poster" class="poster">
<!--<div class="bg"></div>-->
<img class="avatar" src="//yun.duiba.com.cn/aurora/14e3d0fa0e1ff54553a2c8c094b1caffd90f0a43.png" style="display: none"/>
<!--<canvas id="canvas" style="position: absolute; left: 10px; top: 10px;"></canvas>
<!--<div id="poster" class="poster">
&lt;!&ndash;<div class="bg"></div>&ndash;&gt;
<img id="img" class="avatar"/>
&lt;!&ndash;<canvas id="canvas" style="position: absolute; left: 10px; top: 10px;"></canvas>
<p class="ppp">
a<br/>bcdefghij
</p>-->
</div>
</p>&ndash;&gt;
</div>-->
<!--
<span style="background-color: rgba(0,255,0,0.5);">span</span>-->
<script>
......@@ -64,6 +69,17 @@
window['html-shot/debug-mode'] = true;
</script>
<div id="app"></div>
<script type="text/babel">
ReactDOM.render(
<div id="poster" className="poster">
<img src=""/>
</div>,
document.getElementById('app')
);
</script>
<script src="test.js" type="module"></script>
<button id="button">截图</button>
</body>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment