差分

このページの2つのバージョン間の差分を表示します。

--- javascript:jsfiddle [2022/09/23 21:16] – [レスポンシブ対応] ともやん
+++ javascript:jsfiddle [2024/09/03 18:09] (現在) – [ベースとして設定 (Set as base)] ともやん
@@ 行 76: / 行 76: @@
 ==== ライト/ダーク アピアランスの設定 ====
-<WRAP mincode>
 ライト アピアランス (URL の <html><code>light/</code></html> は省略できる)\\
-<code javascript>
+<WRAP mincode><code javascript>
 <script async src="//jsfiddle.net/tomoyan596/af54jpzy/embed/js,html,css,result,resources/light/"></script>
-</code>
+</code></WRAP>
 <WRAP jsfiddle><html>
 <iframe width="100%" height="400" src="//jsfiddle.net/tomoyan596/af54jpzy/embedded/js,html,css,result,resources/light/" allowfullscreen="allowfullscreen" allowpaymentrequest frameborder="0"></iframe>
@@ 行 86: / 行 86: @@
 ダーク アピアランス (URL に <html><code>dark/</code></html> を付け加える)\\
-<code javascript>
+<WRAP mincode><code javascript>
 <script async src="//jsfiddle.net/tomoyan596/af54jpzy/embed/js,html,css,result,resources/dark/"></script>
-</code>
+</code></WRAP>
 <WRAP jsfiddle><html>
 <iframe width="100%" height="400" src="//jsfiddle.net/tomoyan596/af54jpzy/embedded/js,html,css,result,resources/dark/" allowfullscreen="allowfullscreen" allowpaymentrequest frameborder="0"></iframe>
 </html></WRAP>
-</WRAP>
 ==== ベースとして設定 (Set as base) ====
 fiddle を更新していくと version 管理されているが、そのバージョンをベースとして設定すると URL にバージョン(**<version number>**)を指定しない限りはデフォルトでベースを参照するようになる。\\
-<WRAP mincode>
+<WRAP mincode><code javascript>
-<code javascript>
 <script async src="//jsfiddle.net/<user id>/<fiddle id>/<version number>/[iframe: embedded|script: embed]/[tabs: js,html,css,result,resources]/[Visual: light/|dark/]"></script>
-</code>
+</code></WRAP>
-</WRAP>
-<WRAP mincode>
 ベースバージョンを表示\\
-<code html>
+<WRAP mincode><code html>
 <script async src="//jsfiddle.net/tomoyan596/af54jpzy/embed/result,html,js,resources/"></script>
-</code>
+</code></WRAP>
 <WRAP jsfiddle><html>
 <iframe width="100%" height="400" src="//jsfiddle.net/tomoyan596/af54jpzy/embedded/result,html,js,resources/" allowfullscreen="allowfullscreen" allowpaymentrequest frameborder="0"></iframe>
@@ 行 112: / 行 109: @@
 バージョン 35 を表示 (バージョン 35 をベースにしたい場合はバージョン 35 の URL にアクセスして **[ベースとして設定] (Set as base)** をクリックする)\\
-<code html>
+<WRAP mincode><code html>
 <script async src="//jsfiddle.net/tomoyan596/af54jpzy/35/embed/result,html,js,resources/"></script>
-</code>
+</code></WRAP>
 <WRAP jsfiddle><html>
 <iframe width="100%" height="400" src="//jsfiddle.net/tomoyan596/af54jpzy/35/embedded/result,html,js,resources/" allowfullscreen="allowfullscreen" allowpaymentrequest frameborder="0"></iframe>
@@ 行 120: / 行 117: @@
 バージョン 10 を表示\\
-<code html>
+<WRAP mincode><code html>
 <script async src="//jsfiddle.net/tomoyan596/af54jpzy/10/embed/result,html,js,resources/"></script>
-</code>
+</code></WRAP>
 <WRAP jsfiddle><html>
 <iframe width="100%" height="400" src="//jsfiddle.net/tomoyan596/af54jpzy/10/embedded/result,html,js,resources/" allowfullscreen="allowfullscreen" allowpaymentrequest frameborder="0"></iframe>
 </html></WRAP>
-</WRAP>
 参照: [[https://docs.jsfiddle.net/getting-started#setting-fiddle-as-base-version|Setting fiddle as Base Version - Getting started - JSFiddle Docs]]\\
@@ 行 279: / 行 275: @@
 ===== パラメータ =====
 <html>
-<iframe class="jsfiddle_frame" width="100%" height="300" src="//jsfiddle.net/tomoyan596/4vw7e2j5/embedded/js,html,css,result,resources/dark/" allowfullscreen="allowfullscreen" allowpaymentrequest frameborder="0"></iframe>
+<iframe id="jsfiddle001" class="jsfiddle_frame" width="100%" height="300" src="//jsfiddle.net/tomoyan596/4vw7e2j5/embedded/result,js,html,css,resources/dark/?param1=value1&param2=value2" allowfullscreen="allowfullscreen" allowpaymentrequest frameborder="0"></iframe>
+<script>
+  let iframe = document.getElementById("jsfiddle001");
+  iframe.contentWindow.hoge = "受け渡す値";
+  window.hoge = "受け渡す値";
+</script>
 </html>
 ===== 参考文献 =====
 [[https://codysaylor.com/notes/comparing-codepen-jsfiddle-cssdeck-liveweave-jsbin-dabblet/|Comparing Codepen, JSFiddle, JSBin, Glitch, Plunkr, CSSDeck, Liveweave, Dabblet | Cody Saylor]]\\